Skip to content

Implement dark mode for rustup.rs website#4729

Open
Bogay wants to merge 3 commits intorust-lang:mainfrom
Bogay:feat/website-dark-mode
Open

Implement dark mode for rustup.rs website#4729
Bogay wants to merge 3 commits intorust-lang:mainfrom
Bogay:feat/website-dark-mode

Conversation

@Bogay
Copy link
Contributor

@Bogay Bogay commented Feb 26, 2026

This PR introduces dark mode for rustup.rs website. For simplicity, I haven't added theme-switching logic in javascript. Instead, it relies solely on @media (prefers-color-scheme: dark) to override css variables for dark mode. The color palette is adapted from the blog's dark mode with a little modification (rust-lang/blog.rust-lang.org#1343).

However, I am not sure whther the I should adjust of the copy button. It currently uses the browser's default styles, which makes the "Copied!" feedback text slightly difficult to read in dark mode.

Screenshots

before:

image image

after:

image image

Close #4209

so that it's eaiser to write dark mode.
the black logo is almost invisible in dark mode.
following the approach from rust-lang/blog.rust-lang.org@614b18b.
Copy link
Member

@rami3l rami3l left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks a lot! Not using JavaScript is also what I'd prefer with the problem you are trying to resolve. Please feel free to adjust the remaining elements with the light theme background :)

View changes since this review

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

color-scheme support for rustup.rs

2 participants