Open c1rrus opened 1 year ago
Check that your design tokens adhere to the DTCG spec with this free open source Design Tokens Validator
To get started, paste the JSON for your design tokens, or upload a file directly. The site will then validate your tokens and present a list of helpful messages, which link to relevant parts of the spec, to help fix any problems.
Cobalt is an open-source, MIT-licensed frontend toolchain that:
TokensBrücke is a Figma plugin that simplifies the process of converting Figma variables into design-tokens JSON. The plugin generates JSON files compatible with the latest DTCG specification.
@universse 👋🏻 It'd be great to see https://github.com/universse/theminglayer showcased here!
Thanks @kaelig for mentioning this thread 🙌.
ThemingLayer empowers team to craft digital experience that cater to diverse needs of their audience.
Sketch is Mac app for designers to create, team up, prototype, as well as a web app for everyone else to browse, give feedback, inspect, and handoff — in any browser. A complete design platform, made by a sustainable indie company since 2010.
You can export your Color Variables, Layer Styles, and Text Styles as Design Tokens from the web app. You can download your design tokens or create an always-up-to-date public link for them. (Read the docs)
A npm package providing implementation agnostic JavaScript/TypeScript definitions from the Design Tokens Format Module specification, for library developers and tooling creators.
In short, it exposes constants (fontWeights, strokeStyleLineButt...) and TS types to avoid repeating them in every projects.
Do you maintain a tool (or anything else - e.g. a software library) that supports reading and/or writing DTCG files? Then please add a link and some details as a comment here in the following format:
🙏 Please only add things here that have already shipped support for the DTCG file format. If you are planning to support the format but haven't released it yet, that's awesome. However, please wait until you actually ship support before promoting your tool here.
♻️ If details change (e.g. you add more features to your tool), please edit your existing comment rather than adding a new one.
⚠️ The DTCG maintainers reserve the right to remove spammy or inappropriate comments.
Motivation
This list will hopefully be useful for: