Skip to component standard
Components

Data displayVisual draft 0.1

Typography

Defines the hierarchy and rhythm of product content.

CoreFoundational primitiveHTML first
01 / Preview

The current Angle direction.

Display / 48

Recognize every customer.

Body / 16

Build a loyalty experience that adapts to the member, their value, and the moment.

MEMBER_VALUE  $284.20  +18.4%
02 / Decision

What this component must preserve.

Angle component decision

Use Inter for interface language and JetBrains Mono for identifiers, metrics, timestamps, and code.

03 / Anatomy

Parts with a specific job.

Display01
Heading02
Body03
Label04
Mono05
04 / States

The happy path is only one state.

01Default
02Hover
03Active
04Focus
05Disabled
06Loading
07Success
08Error
05 / Guidance

Use the contract, not the screenshot.

Do

Use Inter for interface language and JetBrains Mono for identifiers, metrics, timestamps, and code.

Avoid

Do not create a one-off version that bypasses shared states, tokens, focus behavior, or the component decision documented here.