Skip to design details
AuraUIGitHub
← ALL DESIGNSCAPTURE / 26

Editorial · Bold · High Contrast

Zapier

A high-contrast editorial system with a warm canvas, dark banner, bright orange actions and framed navigation.

Download design.mdOpen preview ↗

Preview

auraui.cc / preview / zapier

↗

Design Principles

  1. 01

    Use the captured semantic tokens as the visual foundation.

  2. 02

    Preserve the source system’s spacing rhythm and type hierarchy.

  3. 03

    Apply accent color deliberately to actions and emphasis.

  4. 04

    Keep surfaces, borders and corner treatments consistent.

Colors

Primary#FF4F00

Background#FFFDF9

Foreground#201515

Surface#30342D

Media#9BAAC8

Typography

DisplayDegular Display

400 / 72px · editorial impact

BodyInter

400 / 16px · neutral utility

Components

  • Actions↗
  • Form controls↗
  • Selection controls↗
  • Notices↗
  • Progress↗
  • Toasts↗

Patterns

  • Semantic tokens◆
  • Responsive spacing◆
  • Type hierarchy◆
  • Surface layering◆
  • Accessible controls◆
READY TO USE

Give your agent a point of view.

Download the complete specification and add it to your project context.

Download design.md