Internal Reference • Color Systems & Usage

High-contrast base (White / Black), with optional theme palettes below. Use yellow for emphasis only; black anchors typography and UI chrome.

Foundation

Background: #FFFFFF (White). Keep canvases clean and bright.

Typography & Frames: #0A0A0A (Black). Primary text, borders, and icons.

Support

Accent/Highlights: #F0A414 (Yellow). Use sparingly for callouts, tags, or progress—not for body copy.

Themes

Each theme adds personality on top of the White/Black foundation. Use one theme per asset to keep a cohesive feel.

Note: No CTA button here. If a CTA is requested in the page brief, use theme colors to outline or a subtle gradient—otherwise, keep it minimal.

.theme-teddy — Theodore “Teddy Bear” Schiele
Primary — Orange
#FC4928
Secondary — Deep Forest Green
#0B3D2E
Accent — Cream
#F5F5DC
Support — Yellow
#F0A414
Foundation — Black
#0A0A0A
Base — White
#FFFFFF
Use Orange for energy (headlines/tags), anchor with Black typography. Cream softens panels or pull-quotes.
.theme-sna — Schiele & Associates
Primary — Deep Navy
#1A2B4B
Secondary — Bold Burgundy
#800020
Accent — Silver
#C0C0C0
Support — Yellow
#F0A414
Foundation — Black
#0A0A0A
Base — White
#FFFFFF
Deep Navy drives trust (headers/nav), Burgundy accents authority. Silver adds a premium, tech-forward sheen.
.theme-cog — The Circle of Growth
Primary — Orange
#F64011
Secondary — Blue
#15A9C5
Support — Yellow
#F0A414
Foundation — Black
#0A0A0A
Base — White
#FFFFFF
Orange = momentum; Blue = clarity. Pair with strong black type for legibility and keep yellow for micro-highlights.
Get More Information