Theme reference

The default theme that ships with Fuegokit React.

Access to Fuegokit npm packages, source code repositories, and some content is limited to Appfire staff. Log in with Slack to continue.

Storybook Figma

Fuegokit React's theme object includes color palettes, type scale, font stacks, breakpoints, border radius values, and more.

This implementation is based on the Styled System Theme Specification.

Fuegokit React's default theme object provides semantic tokens, and Atlassian ecosystem tokens are included by default.

{
  "fontStack": {
    "normal": "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif`",
    "mono": "'SFMono-Medium', 'SF Mono', 'Segoe UI Mono', 'Roboto Mono', 'Ubuntu Mono', Menlo, Consolas, Courier, monospace",
    "title": "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif`"
  },
  "fontFamily": {
    "normal": "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\"",
    "mono": "SFMono-Regular, Consolas, \"Liberation Mono\", Menlo, Courier, monospace",