Design System SeedMoments to Mail

A calmer foundation for thoughtful product surfaces.

The design system starts with warm editorial tokens, consistent panel surfaces, and a deliberate action language so future product screens do not drift into one-off styling.

Color Language

Ink
Paper
Accent
Soft

Surface Rules

  • Use semantic tokens instead of raw hex values in UI code.
  • Prefer shared panel and action treatments over ad hoc utility stacks.
  • Reserve the accent color for actions, emphasis, and active states.

Typography

Strong hierarchy comes from scale, weight, and spacing before decorative styling.

Spacing

Panels, content blocks, and actions follow a restrained rhythm to keep pages readable.

Composition

Build from reusable surfaces and semantic tokens before extracting shared components.

Current Baseline

The system now defines token groups, reusable page primitives, a first auth journey, and a seeded template catalog that can be previewed before editor work begins.

Ready for sender onboarding