[GH-ISSUE #5857] [feature]: Allow users to select a custom accent color #2301

New issue

Open

opened 2026-03-16 23:53:48 +03:00 by kerem · 2 comments

kerem commented

2026-03-16 23:53:48 +03:00

Owner

Originally created by @Sunhaiy on GitHub (Feb 10, 2026).
Original GitHub issue: https://github.com/hoppscotch/hoppscotch/issues/5857

Is there an existing issue for this?

I have searched the existing issues

Summary

Introduce a custom color picker in the theme settings to allow users to define their own accent color via HEX/RGB values, instead of being limited to presets.

Why should this be worked on?

Developers love customizing their environment. Allowing a custom HEX/RGB value lets users match Hoppscotch UI with their operating system's accent color (e.g., Windows/macOS system theme) or their company's brand colors.
While the current presets are great, they might not offer the best contrast or visibility for every user's specific monitor setup or eyesight. A custom picker gives users full control over their viewing experience.
Many developer tools (like VS Code or Terminal emulators) allow extensive theming. Adding this feature would align Hoppscotch with the flexibility users expect from modern development tools.

Originally created by @Sunhaiy on GitHub (Feb 10, 2026). Original GitHub issue: https://github.com/hoppscotch/hoppscotch/issues/5857 ### Is there an existing issue for this? - [x] I have searched the existing issues ### Summary Introduce a custom color picker in the theme settings to allow users to define their own accent color via HEX/RGB values, instead of being limited to presets. ### Why should this be worked on? Developers love customizing their environment. Allowing a custom HEX/RGB value lets users match Hoppscotch UI with their operating system's accent color (e.g., Windows/macOS system theme) or their company's brand colors. While the current presets are great, they might not offer the best contrast or visibility for every user's specific monitor setup or eyesight. A custom picker gives users full control over their viewing experience. Many developer tools (like VS Code or Terminal emulators) allow extensive theming. Adding this feature would align Hoppscotch with the flexibility users expect from modern development tools.

kerem added the

feature

label

2026-03-16 23:53:48 +03:00

kerem commented

2026-03-16 23:53:59 +03:00

Author

Owner

@Sunhaiy commented on GitHub (Feb 10, 2026):

Refactor the theme engine to use CSS Variables (e.g., --accent-color). At runtime, we can calculate different shades (500, 600, etc.) from the user's input using a library like colord and inject them into the :root style.

@Sunhaiy commented on GitHub (Feb 10, 2026): Refactor the theme engine to use CSS Variables (e.g., --accent-color). At runtime, we can calculate different shades (500, 600, etc.) from the user's input using a library like colord and inject them into the :root style.

kerem commented

2026-03-16 23:54:04 +03:00

Author

Owner

@nikhilmahato21 commented on GitHub (Feb 26, 2026):

should i work on this

@nikhilmahato21 commented on GitHub (Feb 26, 2026): should i work on this