Ocelot-Social/src/styleguide/docs/DesignTokens.md

Design tokens are the visual design atoms of the design system — specifically, they are named entities that store visual design attributes. We use them in place of hard-coded values (such as hex values for color or pixel values for spacing) in order to maintain a scalable and consistent visual system for UI development.

You can use tokens as SCSS variables or import them in your JS:

import { tokens } from 'system'