Figma UI Kit

Official Base MiniApp components and tokens for fast, consistent design

Figma UI Kit

Design MiniApps faster with the official Base UI Kit for Figma. Components mirror Base App styles and include responsive variants.

Contents

• Core components: buttons, inputs, cards, sheets, modals, toasts
• Layout primitives: grids, safe‑area frames, navigation bars
• Tokens: color, typography, spacing, radius, elevation
• Templates: first‑run, list/detail, empty, error, auth prompt

Download

• Public link: Figma Base MiniApp UI Kit
• Duplicate to your workspace; keep tokens intact

Using tokens

• Colors and type are provided as styles; do not detach
• Map design tokens to CSS variables shown in Design Principles
• Light and dark modes included via color styles

Contribution

• Suggest improvements via GitHub issues in docs repo
• Include screenshots and rationale

Versioning

• Kit versions follow SemVer (e.g., 1.0.0)
• Breaking visual changes increment major version

Best practices

• Start from templates; avoid reinventing common patterns
• Keep touch targets ≥ 44px
• Use safe‑area frames when composing screens