Roadie Design System
Overview
  • Introduction
  • Getting started
  • Changelog
Foundations
  • Colors
  • Spacing
  • Typography
Tokens
  • Overview
  • Reference
Components
  • Overview
  • Button
  • Code
  • Container
  • Heading
  • Highlight
  • IconButton
  • Mark
  • SpotIllustration
  • Text
  • View

Components

A collection of components built with Ark UI and styled with PandaCSS.

Actions

Button

A fundamental building block for user interactions

beta

IconButton

A square button component optimized for displaying icons

beta

Typography

Code

The Code component is used to display inline code snippets.

beta

Heading

A heading component that uses display styles for titles and section headers

beta

Highlight

The Highlight component is used to highlight query matches within text.

beta

Mark

The Mark component is used to highlight or emphasize text content.

beta

Text

A fundamental typography component for displaying text content

beta

Layout

Container

A layout component that provides a centered container with responsive padding and optional max-width constraint

beta

View

A layout component for arranging elements vertically or horizontally with consistent spacing

beta

Media

SpotIllustration

Themed SVG illustrations with automatic color theming

beta

Previous page

← Reference

Next page

Button →