The visual language behind Parcle — extracted from the marketing site and the product shell. Confident, modern, slightly editorial; premium but not corporate (Linear × Vercel × Stripe). Two product worlds: Skills (indigo→violet, open & energetic) and Memory (gold on ink, exclusive & paid).
Light theme primary. Use accent gradients sparingly (hero, primary CTAs, accent glows) — never muddy. Reserve gold strictly for the Memory / premium world.
Geist for display/headlines & numbers (bold, tight tracking, real hierarchy). Inter for body (generous line-height). Geist Mono only for code, skill IDs, CLI snippets & small technical labels — a subtle nod to the dev audience.
Sections breathe at 88–100px; cards pad 14–28px; controls gap 8–14px.
Primary = Skills gradient, used once per view. Gold = Memory/premium only. Hover lifts 1px; primary CTAs get a gradient shimmer.
Status badges live on cards; the gradient/gold pills mark plan emphasis.
Inputs: 12px radius, hairline-strong border, violet focus ring (0 0 0 4px @16% violet).
The platform vocabulary — sidebar nav, top bar, agent chips, skill cards. Product screens stay dense-but-calm; marketing pages breathe.
Tasteful, weighty. Easing cubic-bezier(.2,.7,.3,1). Scroll reveals fade + 14–24px rise, scroll-linked & reversible. Hover = 1px lift. Primary CTAs shimmer. Hand-drawn doodles (Caveat note + grainy arrow) draw in together. Always gate decorative motion on prefers-reduced-motion.
Confident, concise, dev-friendly. Title Case CTAs. Real content, realistic data — no lorem, no filler stats. Lead Skills with “free & open-source”; position Memory as the premium, paid sibling. Avoid AI-startup tropes & emoji.