chore(ui): rebrand the classic UI to the 2026 brand (Earth Undertones) - #15750
Draft
devGregA wants to merge 1 commit into
Draft
chore(ui): rebrand the classic UI to the 2026 brand (Earth Undertones)#15750devGregA wants to merge 1 commit into
devGregA wants to merge 1 commit into
Conversation
Applies Brand Guidelines v1.0 (Aug 2026) to the open-source UI chrome: - Primary token ramp (components/tailwind.css) moves from Fuji Blue to Dystopian Orange, with the chrome steps (800/900: sidebar and logo bar) as Midnight 1 / Deep Midnight per the guide's primary pairing (Dystopian Orange with Midnight). - Body links use the guide's digital-only Accent Blue (#234d93) via a new --color-dd-link token; sidebar sub-nav text uses Daybreak. - Accent tokens move to the Dystopian/Electric orange family with a Grunge light variant; dashboard panel-blue becomes Dusk. - Typography: @fontsource-variable/inter replaces work-sans (Inter Variable stack; copy:fonts script updated; woff2 files swapped). - Text token moves to Charcoal 1 (#25282a), muted to the warm gray. - Checkbox/radio/dropdown/select2 hardcoded blues re-pointed to the new tokens' values. Deliberately untouched: severity colors, badge counts, panel green/yellow/red, alert reds/ambers (data semantics, not brand), neutral gray surfaces, all JS, all templates except the inline chrome styles and comments in base.html. tailwind-out.css regenerated with yarn build:css (tailwindcss v4.3.3); yarn.lock updated for the fontsource swap. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
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.
What this is
The open-source classic UI restyled to Brand Guidelines v1.0 (Aug 2026), joining the four web properties already drafted (status page, docs #15736, trust center, cloud portal). Chrome-level rebrand: tokens, fonts, logo-adjacent chrome; not a redesign.
What changed
components/tailwind.css@theme): Fuji Blue 50-900 becomes Dystopian Orange through step 700, with steps 800/900 as Midnight 1 / Deep Midnight. That split is deliberate: the guide's primary palette pairs Dystopian Orange with Midnight, and 800/900 are exactly the chrome surfaces (sidebar, logo bar). Buttons/hovers ride 500/700 (orange, Electric on hover); the sidebar stays a deep brand chrome instead of turning burnt orange.#234d93(new--color-dd-linktoken;a{}in dojo.css re-pointed). Sidebar sub-nav text becomes Daybreak on the dark chrome.panel-bluebecomes Dusk#005f73(stays distinct from the semantic green/yellow/red panels).@fontsource-variable/interreplaceswork-sans(dependency, copy:fonts glob, font stack, committed woff2 files).tailwind-out.cssregenerated withyarn build:css.#25282a, muted to the warm gray used across the other properties.Deliberately untouched
--color-severity-*), badge counts, panel green/yellow/red, and alert reds/ambers: those are data semantics in a vulnerability tool, not brand surface. Critical stays red.base.html.Verification
yarn install+yarn build:cssclean (tailwindcss v4.3.3); lockfile updated for the font swap only.tailwind-out.css+dojo.css: sidebarrgb(0,48,56)Midnight with Deep Midnight logo bar,.btn-primaryrgb(255,107,53), body linkrgb(35,77,147), Inter Variable active, checked controls orange.git diffontailwind-out.csscontains no severity-token changes.🤖 Generated with Claude Code