Context / Problem
Currently, the X Open Source website (opensource.x.com) primarily defaults to a light interface. Many developers browse repositories, check open-source initiatives, and read tech stacks in low-light environments or use system-wide dark themes to minimize eye fatigue.
Since the main X platform highly prioritizes dark theme options (Dim and Lights Out), the open-source website should ideally provide a cohesive user experience.
Proposed Solution
Introduce a native theme-switching feature that includes:
- Automatic Detection: Listen to system preferences dynamically using
prefers-color-scheme: dark.
- Manual Toggle: Add a minimal, accessible toggle icon (such as a 🌙 / ☀️ icon) in the header or footer navigation bar so users can override system preferences.
- Persistent Storage: Save the chosen theme in
localStorage so the setting persists across page reloads.
Benefits
- Accessibility: Improves readability for visually sensitive users.
- Consistency: Aligns the portal's aesthetic closer to the dark UI configurations of modern developer portals and X itself.
- Better UX: Prevents sudden bright screen flashes when transitioning from standard developer setups (IDEs/GitHub in dark mode) to this website.
Context / Problem
Currently, the X Open Source website (
opensource.x.com) primarily defaults to a light interface. Many developers browse repositories, check open-source initiatives, and read tech stacks in low-light environments or use system-wide dark themes to minimize eye fatigue.Since the main X platform highly prioritizes dark theme options (Dim and Lights Out), the open-source website should ideally provide a cohesive user experience.
Proposed Solution
Introduce a native theme-switching feature that includes:
prefers-color-scheme: dark.localStorageso the setting persists across page reloads.Benefits