.png){kind=tracking}
Get in touch
Do you want a partner who obsesses about value as much as you do? Let’s talk!
Components
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Block quote
Ordered list
Unordered list
Bold text
Emphasis
Superscript
Subscript
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Block quote
Ordered list
Unordered list
Bold text
Emphasis
Superscript
Subscript
Do you want a partner who obsesses about value as much as you do? Let’s talk!
.svg){kind=small}
brand/blue · #005FFF
brand/red · #FF3302
brand/green · #1BEE92
brand/yellow · #FFC100
secondary/blue · #81ABF7
secondary/red · #F98B75
secondary/green · #66D8A1
secondary/yellow · #EAC354
neutral/light · #E2E7EA · light surfaces only — not a text colour
neutral/dark · #000911
neutral/gray · #5B616B
neutral/disabled · #B5BABF
reserved/white · #FFFFFF · body text on dark surfaces + CTA labels (decision 28 Jul: neutral/light lacked contrast as text)
border/default · rgba(0,9,17,0.12)
1 · All H1 Headings → weight 600 ·· 2 · v2-rich-text > All H3 Headings → 600 ·· 3 · v2-rich-text > All H4 Headings → 600 ·· 4 · fg-rich-text > All H1 Headings → 700 to 600 ·· 5 · v2-rich-text > All Paragraphs → 400 ·· 6 · All Paragraphs → 400 + remove hardcoded colour ·· 7 · All Labels → remove hardcoded colour. Then sweep pages for wrong-surface text (dark on dark / light on light).
The rich-text specimen above renders these exact tag styles — select the target text there to reach each style in the Style panel.
Classes: v2-rich-text-copy + v2-rich-text-larger → v2-rich-text · v2-heading-4-copy → v2-heading-4 · v2-form-input-group-copy → v2-form-input-group · fg-primary-button-2/-3/-4 → fg-primary-button · fg-text-field-2/-3/-4 → fg-text-field · btn + primary-button → v2-primary-button-lrg/-med · v2-link-copy → v2-link · v2-section-home-copy → v2-section-home · Button + Menu Button 5 → do not use. Variables (values aligned to tokens, renamed in Variables panel): Fabric Blue, dark-blue → brand/blue · Orange Red → brand/red · White → reserved/white · Light Blue → secondary/blue · Gold → brand/yellow · medium-grey → neutral/gray · Silver → neutral/disabled · Medium Aquamarine → secondary/green · v2 Background, Dark, Charcoal, Form Input, Black → neutral/dark · Seasalt → neutral/light
The Field Guide is the gated product area. Same tokens, two intentional deviations: light card surfaces (reserved/white bg + neutral/dark text — the surface owns its text colour) and 10px corner radius. Everything below renders its real class.
fg-rich-text paragraph — weight 400, inherits the card's neutral/dark text. The quick brown fox jumps over the lazy dog.
Other Field Guide classes: fg-text-field (36px, 10px radius) · fg-form-field / fg-form-fields (flex column, 12px gap) · fg-card-hero-image (400px, 10px radius) · fg-collection-card-container · fg-button-text. Deprecated: fg-primary-button-2/-3/-4, fg-text-field-2/-3/-4 → use the originals. Pending decision: fg-primary-button colour binding (Phase 4 row 4.5, flagged).
