Build theme settings page (dark/light/system) with persistence

[Abidoyesimze]

Epic

Page Design Issues (Dummy Data Only)

Description

• Add user theme controls for dark, light, and system preference
• Persist selection via local storage
• Ensure all components honor theme tokens
• Design spec (must use; measurable):
  • Tokens per Issue 3
  • Theme switch control min-height 44px
  • Theme transition duration <= 200ms and no flash on load
  • Contrast remains WCAG AA in both themes

Acceptance criteria

• Theme setting toggles correctly
• Preference persists after refresh
• No theme flash on initial render
• PR includes screenshots in all 3 modes

Suggested GitHub labels

frontend, theming, settings, priority-medium

---

[mac-dubem]

I have experience building frontend theming systems with dark, light, and system modes. I can implement persistent theme preferences, eliminate theme flash on load, ensure accessibility compliance, and deliver a tested PR with screenshots for all modes.

[ritik4ever]

@ritik4ever has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

Hi,

I’d be happy to work on this issue if it’s still available. I’m a full-stack developer with experience in both Web2 and Web3 technologies, and I’ve contributed to several open-source projects. After reviewing the issue, I’m confident I can implement the required changes and submit a quality PR promptly.

Please assign it to me if available. Thanks!

ℹ️ Repo Maintainers: To accept this application, review their application or assign @ritik4ever to this issue.

[OpadijoIdris]

@OpadijoIdris has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

I would love to work on this task, please

ℹ️ Repo Maintainers: To accept this application, review their application or assign @OpadijoIdris to this issue.

[ajulaybeeb]

@ajulaybeeb has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

Hi Maintainer, I have reviewed the description of the issue and would like to hop on this issue and deliver ETA

ℹ️ Repo Maintainers: To accept this application, review their application or assign @ajulaybeeb to this issue.

[Levi-Ojukwu]

@Levi-Ojukwu has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

Hello maintainer, I can handle this issue. Kindly assign.

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Levi-Ojukwu to this issue.

[drips-wave]

Congratulations, @ritik4ever! 🎉 Your application was accepted by the repo's maintainers, and the issue is due on June 30, 2026.

🧑‍💻 @ritik4ever: Please resolve the issue such that the repo's maintainers have enough time to review your contribution before the due date. You'll earn Points for completing the issue on-time, which will make you eligible for a share of the Stellar Wave Program's reward pool.

Warning

When opening a PR, please link it to this issue to ensure it gets tracked accurately. Points are awarded when this issue is marked as completed by the maintainer.

🤠 Repo maintainers: Please keep an eye on the contributor's progress and review their work before the due date. You can manage this issue, including adjusting its complexity and points, here.

🌊 Happy Wave 🌊