Skip to content
This repository was archived by the owner on Sep 20, 2024. It is now read-only.

Latest commit

 

History

History
37 lines (29 loc) · 1.21 KB

theming-with-chakra-ui.mdx

File metadata and controls

37 lines (29 loc) · 1.21 KB

import Code from '../components/CodeBlock'

Theming

By default, Chakra UI exposes a default theme object that follows the System UI Theme Specification.

This object/theme specification provides a way to store your design system's style values (e.g. colors), design tokens and scales.

Understanding Chakra's Theme Specification

Chakra UI's theme object is built around the idea of scales.

Scales include values like a typographic scale (for your applications font styles), a spacing scale for margins and paddings, and a color scale for your application's colors.

The theme is defined as a single object that exports difference scale values.


For a more detailed breakdown on the System UI theme breakdown see their official documentation