Styling

ARc combines styled-components with styled-tools and styled-theme for styling components.

You can refer to their GitHub repositories or to the components on src-example/components so you can learn how to use them properly. Here's a basic usage:

import styled from 'styled-components'
import { font, palette } from 'styled-theme'

const Atom = styled.span`
  font-family: ${font('primary')};
  color: ${palette({ grayscale: 0 }, 1)};
`

Theming

Use src/components/themes/default.js to define a default theme for your application.