Lookbook

    Lookbook

    Component style guide and design system reference

    Color Palette

    Primary Purple#7856ff251 100% 67%
    Bubblegum#f35361355 87% 64%
    Teal#25CED1181 70% 48%
    Yellow#D7D70960 92% 44%
    Merlot#C757C7300 50% 56%
    Headline#2A2A2F240 6% 17%
    Foreground#2E3238220 9% 17%
    Muted Foreground#6B7280215 16% 47%
    Muted Background#F9FAFB210 20% 98%
    Border#E5E7EB220 13% 91%

    Typography

    Heading 1 — Page title
    The quick brown fox jumps
    .text-h1
    Heading 2 — Section header

    The quick brown fox jumps

    .text-h2
    Heading 3 — Card / element title

    The quick brown fox jumps

    .text-h3
    Subtitle

    A short descriptive line beneath a headline.

    .text-subtitle
    Body

    The quick brown fox jumps over the lazy dog. Body text carries the narrative weight across case studies and profile sections.

    .text-body
    Callout / quote

    "A seller's verbatim pulled into a highlighted block."

    .text-callout
    Caption

    A tiny note or metadata line.

    .text-caption
    Label / eyebrow
    Concentration
    13 of 17 (76%)
    .text-eyebrow
    Metric value
    1.11M
    .text-metric
    Breadcrumb
    Big Cartel/FeedbackBot
    .text-breadcrumb / .text-breadcrumb-current
    Small / helper text

    Used in chart legends, dense grids, and secondary descriptions.

    .text-helper

    Charts

    B. Events
    1.11M
    events
    ↑ 16.59%
    C. Sessions
    393.4K
    sessions
    ↑ 19.61%
    A. Users
    40.85K
    users
    ↑ 10.10%
    All Events [Total Events]
    Total Events
    Signups
    Charged
    Succeeded
    2A - like video • 44.41%
    2B - dislike video • 37.53%
    100%75%50%25%0%
    44.4%
    37.5%
    1 First Time App Opens
    2 2A or 2B
    Other
    #BurningMan
    #FashionWeek
    #LondonMarathon
    +9 More
    430.9K
    Unique Users
    Lived
    Work / Clients
    Travel