tipme

Development specimen · Not a product page

Design foundation.

Tokens and primitives from @tipme/ui. Controls here are static specimens and do nothing.

Colour

  • #7A32F9
    --brand-primary
    Brand, selected and focus

  • #FFFFFF
    --surface-base
    Canvas and surfaces

  • #000000
    --text-primary
    Headlines and essential text

  • #511CB0
    --brand-ink
    Purple text on light surfaces

  • #F1E9FF
    --brand-soft
    Quiet emphasis surfaces

  • #555555
    --text-secondary
    Supporting text

Typography

Eyebrow label

Heading accent

Body copy uses the system sans stack at a comfortable 1.7 line height for long-form reading.

Actions

BadgeDemo only

Fields

Hint text sits between label and control.

Resizes vertically.

Choice

Choose a sample option

Feedback

Neutral notice
Supporting context for the current step.
✓ Preferences saved
A generic, non-financial success example.
Loading specimen

Nothing here yet

Empty states explain what is missing and what to do next.