Parsers

Parsers API reference

Utility parsers

Utility parsers help you mutate your token tree before generating final outputs.

Utility parsers do not have the output option since they mutate the internal state without producing any actual output.

Parser	Description	Usage example
change-case	This parser helps you change the case of names or modes over a SDTF graph.	Example
convert-color	This parser helps you convert the color formats of color compatible tokens over a SDTF graph.	Example
convert-dimension	This parser helps you convert units of dimension tokens (spacing, sizing, breakpoint, blur...) and composite tokens sub values (font-size, letter-spacing, border-width...).	Example
make-line-height-relative	This parser helps you transform your text style lineheight values relative to their font size.	Example
filter	This parser helps you filter a SDTF graph.	Example
register-view	This parser helps you register a SDTF view that can be later used by generation parser to allow for partial outputs of the token tree with no destructive mutations.	Example
select-modes	This parser helps you select design tokens from specific mode(s).	Example
prefix-by	This parser helps you prefix the name of your collections, groups and tokens from your SDTF token tree.	Example
suffix-by	This parser helps you suffix the name of your collections, groups and tokens from your SDTF token tree.	Example
replace-string	This parser helps you replace a part or the whole name of your collections, groups and tokens from your SDTF token tree.	Example

Generation parsers

Generation parsers help you generate your token tree into any technology / purposed oriented outputs.

Many generation parsers can be placed in the same parser rule, as long as they all need the same transformed - or not - token tree and they all use the file or directory output setting.

Parser	Description	Usage example
to-css-custom-properties	This parser helps you transform design tokens in CSS Custom Properties.	Example
to-css-text-style	This parser helps you generate text styles as CSS classes.	Example
to-css-font-import	This parser helps you create CSS @font-face rules to import your font files.	Example
to-flutter	This parser helps you generate a Flutter theme from all your design tokens coming from Specify.	Example
to-javascript	This parser helps you pull design tokens as JavaScript objects for all token types and their respective getter functions.	Example
to-json	This parser helps you pull design tokens in JSON with token values in JSON or CSS.	Example
to-json-list	This parser helps you pull design tokens in JSON within an iterable array structure.	Example
to-kotlin	This parser helps you generate design tokens for Kotlin.	Example
to-react-native	This parser helps you pull design tokens as a theme compatible with React Native and their respective helper functions.	Example
to-scss-mixin-text-style	This parser helps you generate text styles as SCSS mixins.	Example
to-scss-map	This parser helps you generate .scss files for each token type containing SCSS map and function / mixin to access the values of the tokens.	Example
to-sdtf	This parser helps you get your design tokens as a SDTF graph in JSON.	Example
to-style-dictionary	This parser helps you generate Style Dictionary raw token files for all your design tokens coming from Specify.	Example
to-swift	This parser helps you generate design tokens as Swift classes.	Example
to-tailwind	This parser helps you generate a Tailwind theme from all your design tokens coming from Specify.	Example
to-typescript	This parser helps you pull design tokens as TypeScript objects for all token types and their respective getter functions.	Example
svgo	This parser help you optimize and transform your SVG strings with svgo.	Example
svg-to-jsx	This parser helps you generate JSX or TSX components from your vector assets.	Example
svg-to-tsx	This parser helps you generate TSX components from your vector assets.	Example
to-svg-file	This parser helps you generate SVG files from your vector assets.	Example
to-bitmap-file	This parser helps you generate PNG and JPG files from your bitmap assets.	Example
to-file	This parser helps you generate files from any asset token: Bitmap, Font and Vector.	Example