Cmd/Ctrl + K to search
ESC to clear / exit
Acorn
  • Home
  • Get started
  • Foundations
  • Content
  • Desktop
  • Mobile
  • Support
Home Get started Foundations Content Desktop Mobile Support
  • Desktop overview
  • Design tokens
    • How design tokens work
    • Border
    • Color
    • Icon
    • Shadow
    • Size
    • Space
    • Typography
    • Search view
  • Styles
    • Color
    • Typography
    • Iconography
    • Theming
  • Components
    • Badge
    • Box Button
    • Box Group
    • Box Item
    • Box Link
    • Breadcrumb Group
    • Button
    • Checkbox
    • Fieldset
    • Input Color
    • Input Search
    • Input Text
    • Message bar
    • Promo
    • Radio Group
    • Spotlight modal
    • Toggle
  • Patterns
    • Browser settings
    • Keyboard shortcuts
    • Browser anatomy

Desktop overview

The styles, components, tokens, patterns, and resources to create Firefox experiences on desktop.

Design tokens

How design tokens work

Color

Design tokens

Border

Design tokens

Icon

Design tokens

Size

Design tokens

Shadow

Design tokens

Space

Design tokens

Typography

Design tokens

Styles

Color

Typography

Iconography

Theming

Components

Badge

Button

Box Button

Box Group

Box Item

Box Link

Checkbox

Fieldset

Input Color

Input Search

Input Text

Message bar

Radio Group

Spotlight modal

Toggle

Patterns

Browser settings

Browser anatomy

Keyboard shortcuts

 

On this page
  • Design tokens
  • Styles
  • Components
  • Patterns

Acorn Design System ©2026 Mozilla