google / google/model-viewer

Add support for a dark mode on modelviewer.dev documentation

Open
#5,190 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
8.2k
Forks
947
PR merge metrics
No merged PRs in 30d

Description

Hi! I'd like to contribute a dark mode for the documentation site (modelviewer.dev) and wanted to get feedback before opening a PR.
I think it is high time that model viewer doc gets a dark mode, as long reading on white mode hurts my eyes at least.

I have a working prototype that:

- Supports both prefers-color-scheme and a manual theme toggle.
- Persists the user's preference using localStorage.
- Adds a theme toggle button to the docs.

At the moment this is just a prototype to demonstrate the feature. I've only handled the main model-viewer logo so far; the remaining icons (check, warning, etc.) and other UI polish would be completed before submitting the PR.

Would a dark mode be a welcome addition to the documentation? Also, is the current toggle/button placement acceptable, or would you prefer a different UI or implementation approach? @diegoteran

I'd be happy to refine it based on your feedback before opening the PR.

Demo :

https://github.com/user-attachments/assets/12fba520-322f-43f2-bdf5-e39aa17db7a6

Contributor guide

Open the contributing guide

Research direction

Review the prototype linked in the issue, then locate the modelviewer.dev documentation site's styling and theme entry points. Confirm how the existing prefers-color-scheme support, manual toggle, localStorage preference, remaining icons, and UI polish should be integrated; done means the documentation has a complete, approved dark-mode experience.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
design, documentation, frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Needs clarification
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.