Skip to content

feat(appearance): add customizable accent themes and overlay styles#551

Closed
brieyla1 wants to merge 6 commits intocjpais:mainfrom
brieyla1:added-styles
Closed

feat(appearance): add customizable accent themes and overlay styles#551
brieyla1 wants to merge 6 commits intocjpais:mainfrom
brieyla1:added-styles

Conversation

@brieyla1
Copy link
Copy Markdown

@brieyla1 brieyla1 commented Jan 7, 2026

Before Submitting This PR

Please confirm you have done the following:

Description

I found that apps like SuperWhisper and WhisperFlow have really polished, good-looking UIs. Handy is not only fast but also fully local, so I wanted to combine the best of both worlds—bringing a more visually appealing and customizable UI to both the settings page and the recording overlay.

Changes:

  • add new Appearance settings tab in sidebar with accent color and overlay customization
  • add 6 accent color themes (Pink, Blue, Green, Purple, Orange, Teal) applied across app and overlay
  • add 3 overlay style themes (Pill, Minimal, Glassmorphism) with live preview
  • add audio bar customization: count (3-15), size (2-12px), color (accent or preset colors), centered mode
  • add icon visibility toggle for overlay themes
  • create shared overlay components (AudioBars, OverlayDisplay) used by both preview and actual overlay
  • add real-time event updates so overlay reflects changes immediately without restart
  • add Tauri commands for all new appearance settings with persistence
  • add translations for new appearance settings

Related Issues/Discussions

Related to UI/UX improvements and customization requests.

Testing

  • verified accent theme switching works across all 6 themes
  • verified overlay themes render correctly (Pill, Minimal, Glassmorphism)
  • verified bar customization updates in real-time (count, size, color, centered)
  • verified icon toggle works on all overlay themes
  • verified preview matches actual recording overlay
  • verified settings persist across app restarts
  • verified lint passes
  • verified cargo check passes

Screenshots/Videos (if applicable)

CleanShot 2026-01-08 at 03 58 05@2x

Lancelot de Briey added 6 commits January 8, 2026 02:47
- Added accent theme options (pink, blue, green, purple, orange, teal) to the application.
- Introduced a new AppearanceSettings component in the sidebar for theme selection.
- Updated CSS variables for light and dark themes to support accent colors.
- Integrated theme synchronization from settings across the app and overlay components.
- Enhanced the RecordingOverlay to reflect the selected accent theme dynamically.
- Updated translations for the new appearance settings in English.
- Added new settings for audio bars in the overlay, including centered alignment, customizable bar count, and color options.
- Updated the AppearanceSettings component to allow users to modify these new settings.
- Enhanced OverlayDisplay and AudioBars components to support the new customization features.
- Updated translations for the new settings in English.
- Introduced a new setting for overlay audio bars to allow users to customize the bar size.
- Updated the AppearanceSettings and OverlayDisplay components to support the new bar size feature.
- Enhanced the RecordingOverlay to reflect changes in bar size dynamically.
- Added corresponding translations for the new bar size setting in English.
- Implemented backend support for saving and emitting bar size changes.
@cjpais
Copy link
Copy Markdown
Owner

cjpais commented Jan 8, 2026

So this is not going to be merged as is. The colors are the brand identity and I'm not interested in changing them. I'm happy to mute out the accent color for more monochromatic in something like the overlay, but customizing color is not going to make it.

The overlay style might make it in, and open to different nice styles there

@brieyla1
Copy link
Copy Markdown
Author

brieyla1 commented Jan 8, 2026

Would it make sense to put the color switcher in the debug menu then ?

@cjpais
Copy link
Copy Markdown
Owner

cjpais commented Jan 8, 2026

The colors are the brand identity and I'm not interested in changing them.

Any color change in the app will not be accepted at present. I don't want to add a setting for it or additional code to support it

@brieyla1
Copy link
Copy Markdown
Author

brieyla1 commented Jan 8, 2026

That's a shame, I thought it would be a nice + that "feels" open source.
Not even in the config JSON ?
If that's final, I'll strip it down.

@cjpais
Copy link
Copy Markdown
Owner

cjpais commented Jan 8, 2026

If you really believe go collect community feedback. It was there in the github issue template when you submitted this PR. But without community support I'm not super interested. Go engage with other people and get design feedback. If you don't get any feedback I make the decisions ultimately.

I don't think the feeling of open source is necessarily a good target either. I would much rather feel polished than feel open source. The app already feels too complicated to me in that direction so I actively combat adding complexity where I can and there is no requests from the community. And even with requests from the community I will hold out on bringing things in until there is a design I find acceptable

@brieyla1
Copy link
Copy Markdown
Author

brieyla1 commented Jan 9, 2026

That makes total sense, i'll ask around and check

@cjpais
Copy link
Copy Markdown
Owner

cjpais commented Jan 10, 2026

I'm gonna close this PR for now. If you wanna resubmit it with the overlay styles, I'm more open than to that, but just note it may take some time to actually come in as it's fairly low on my priority list and I have some big stuff I'd like to get in soon, ideally which will need some solid focus time for me to develop

@cjpais cjpais closed this Jan 10, 2026
@MaxITService
Copy link
Copy Markdown

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.

3 participants