Reimagine the UI with the "Nocturne" design language - #13
Merged
Conversation
A ground-up visual redesign around the idea that Hush is the moment after the noise stops — hushed, editorial, restrained: - Typography: serif (system Noto Serif) display/headline/title-large styles for an editorial voice; sans for everything read at speed - Color: light theme becomes warm linen paper with a deep dusk-indigo primary; dark theme a near-black midnight sky with moonlit lilac. The six candy accents collapse into a dusty semantic set (ember red = block, dusk gold = mute, sage = allow; slate/plum/teal metadata) - Surfaces: flat cards with hairline borders and larger radii replace tonal fills and drop shadows; new QuietSurface component - Navigation: floating pill bottom bar with an expanding filled pill for the selected tab, replacing the stock NavigationBar - Chat: solid ink user bubbles, serif "h" monogram avatar, bordered pill input, theme-aware AI status bubbles (drops the light-only pastel hacks so dark mode renders correctly) - Rules: action-colored edge bars, outlined attribute chips - History: serif italic datelines, serif monogram discs, tint-based status badges that work in both themes - Settings: sections grouped into hairline-bordered islands with soft-washed icon tiles - Onboarding: dusk-gradient hero reserved as the app's one gradient moment, serif wordmark and italic tagline All test tags, user-visible strings relied on by tests, and ViewModel contracts are unchanged. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01N5ZagcBdYgvCwzCpJGRBH1
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
A ground-up visual redesign around the idea that Hush is the moment
after the noise stops — hushed, editorial, restrained:
styles for an editorial voice; sans for everything read at speed
primary; dark theme a near-black midnight sky with moonlit lilac.
The six candy accents collapse into a dusty semantic set (ember red
= block, dusk gold = mute, sage = allow; slate/plum/teal metadata)
tonal fills and drop shadows; new QuietSurface component
for the selected tab, replacing the stock NavigationBar
pill input, theme-aware AI status bubbles (drops the light-only
pastel hacks so dark mode renders correctly)
status badges that work in both themes
soft-washed icon tiles
moment, serif wordmark and italic tagline
All test tags, user-visible strings relied on by tests, and ViewModel
contracts are unchanged.
Co-Authored-By: Claude Fable 5 noreply@anthropic.com
Claude-Session: https://claude.ai/code/session_01N5ZagcBdYgvCwzCpJGRBH1