Design & CSS
Processed locallyDesign Tokens Converter
Convert nested design tokens and CSS custom properties.
Tool options · presets, sharing & more
Presets & sharing: options only, never files, text or passwords. Undo/redo: editable form values, not file selection or generated results.
How to Use Design Tokens Converter
Enter layout, selector, polygon or design-token data, or upload a compatible font.
Choose the available settings and run the tool.
Inspect the preview and the generated CSS, diagram or font metadata.
Copy or download the output and test it in your target project.
What This Tool Does
Convert nested design tokens and CSS custom properties. Read the format requirements and practical limits in the interface before processing.
Common Use Cases
This tool processes files and input in this browser tab. Its processing code does not upload them to a server. Loading this page and fetching uncached app files uses an internet connection. Optional usage analytics requires your consent and excludes input, filenames, passwords and generated content. Form undo history and result transfers stay in session memory. Explicitly saved presets contain approved settings only.
Offline use is not verified for this tool. Keep an internet connection available to load its page, code and any additional dependencies.
Frequently Asked Questions
What should I check before using Design Tokens Converter?
Convert nested design tokens and CSS custom properties. Read the format requirements and practical limits in the interface before processing.
Does this tool work offline?
Offline use is not verified for this tool. Keep an internet connection available to load its page, code and any additional dependencies.
Can I keep my original file?
Yes. Processing creates a separate result and does not overwrite your source file. Keep the original until you have reviewed the output.