Topic: "design-tokens"
Shopify/polaris
Shopify’s design system to help us work together to build a great experience for all of our merchants.
Language: TypeScript - Size: 266 MB - Last synced at: 4 days ago - Pushed at: 8 days ago - Stars: 5,913 - Forks: 1,189
chakra-ui/panda
🐼 Universal, Type-Safe, CSS-in-JS Framework for Product Teams ⚡️
Language: TypeScript - Size: 38.9 MB - Last synced at: 4 days ago - Pushed at: 4 days ago - Stars: 5,493 - Forks: 259
system-ui/theme-ui
Build consistent, themeable React apps based on constraint-based design principles
Language: TypeScript - Size: 29 MB - Last synced at: 4 days ago - Pushed at: 25 days ago - Stars: 5,340 - Forks: 677
amzn/style-dictionary
A build system for creating cross-platform styles.
Language: JavaScript - Size: 15.1 MB - Last synced at: 2 days ago - Pushed at: 4 days ago - Stars: 4,137 - Forks: 590
salesforce-ux/theo
Theo is a an abstraction for transforming and formatting Design Tokens
Language: JavaScript - Size: 2.21 MB - Last synced at: 6 days ago - Pushed at: over 3 years ago - Stars: 1,983 - Forks: 119
design-tokens/community-group
This is the official DTCG repository for the design tokens specification.
Language: HTML - Size: 857 KB - Last synced at: 7 days ago - Pushed at: 7 days ago - Stars: 1,634 - Forks: 68
tokens-studio/figma-plugin
Official repository of the plugin 'Tokens Studio for Figma' (Figma Tokens)
Language: TypeScript - Size: 23.5 MB - Last synced at: 2 days ago - Pushed at: 2 days ago - Stars: 1,429 - Forks: 205
diez/diez
The Design Token Framework — Adopt a unified design language across platforms, codebases, and teams
Language: TypeScript - Size: 67.6 MB - Last synced at: 12 days ago - Pushed at: over 2 years ago - Stars: 1,236 - Forks: 63
sturobson/Awesome-Design-Tokens
A list of resources on all things to do with Design Tokens
Size: 208 KB - Last synced at: 1 day ago - Pushed at: 6 months ago - Stars: 1,231 - Forks: 85
lukasoppermann/design-tokens
🎨 Figma plugin to export design tokens to json in an amazon style dictionary compatible format.
Language: TypeScript - Size: 14.6 MB - Last synced at: 6 months ago - Pushed at: 7 months ago - Stars: 961 - Forks: 134
mikaelvesavuori/figmagic
Figmagic is the missing piece between DevOps and design: Generate design tokens, export graphics, and extract design token-driven React components from your Figma documents.
Language: TypeScript - Size: 13 MB - Last synced at: 6 days ago - Pushed at: 16 days ago - Stars: 824 - Forks: 76
patternfly/patternfly-react
A set of React components for the PatternFly project.
Language: TypeScript - Size: 309 MB - Last synced at: about 13 hours ago - Pushed at: about 20 hours ago - Stars: 820 - Forks: 363
klaufel/awesome-design-systems
📒 A curated list of bookmarks, resources and articles about design systems focused on developers.
Size: 143 KB - Last synced at: about 17 hours ago - Pushed at: 4 months ago - Stars: 756 - Forks: 45
Tahul/pinceau
🖌️ Make your <script> lighter and your <style> smarter
Language: TypeScript - Size: 15.5 MB - Last synced at: 13 days ago - Pushed at: 6 months ago - Stars: 685 - Forks: 20
UX-and-I/storybook-design-token
Display design token documentation generated from your stylesheets and icon files. Preview design token changes in the browser. Add your design tokens to your Storybook Docs pages using the custom Doc Blocks.
Language: TypeScript - Size: 4.38 MB - Last synced at: 12 days ago - Pushed at: about 2 months ago - Stars: 658 - Forks: 126
components-ai/css.gui
Visual development environment for CSS
Language: TypeScript - Size: 4.84 MB - Last synced at: 5 days ago - Pushed at: over 1 year ago - Stars: 555 - Forks: 25
mrmartineau/design-system-utils
👩🎨 Access your design tokens with ease
Language: TypeScript - Size: 1.36 MB - Last synced at: 14 days ago - Pushed at: about 5 years ago - Stars: 542 - Forks: 13
system-ui/theme-specification
A specification for defining theme objects & design tokens for use with UI components
Size: 15.6 KB - Last synced at: 6 months ago - Pushed at: about 1 year ago - Stars: 532 - Forks: 19
hashicorp/design-system
Helios Design System
Language: TypeScript - Size: 283 MB - Last synced at: about 12 hours ago - Pushed at: about 14 hours ago - Stars: 463 - Forks: 48
ardov/huetone
A tool to create accessible color systems
Language: TypeScript - Size: 804 KB - Last synced at: 28 days ago - Pushed at: over 1 year ago - Stars: 378 - Forks: 39
Decathlon/vitamin-web
Decathlon Design System UI components for web applications
Language: HTML - Size: 24.8 MB - Last synced at: 7 days ago - Pushed at: 5 months ago - Stars: 286 - Forks: 77
Shopify/polaris-tokens 📦
Design tokens for Polaris, Shopify’s design system
Language: TypeScript - Size: 6.99 MB - Last synced at: about 19 hours ago - Pushed at: over 3 years ago - Stars: 233 - Forks: 35
material-foundation/material-tokens
Material Design DSP
Language: CSS - Size: 2.13 MB - Last synced at: 12 months ago - Pushed at: over 1 year ago - Stars: 219 - Forks: 33
terrazzoapp/terrazzo
Use DTCG tokens JSON to generate code for web, mobile, native apps, and more
Language: TypeScript - Size: 9.83 MB - Last synced at: 1 day ago - Pushed at: 12 days ago - Stars: 195 - Forks: 36
juntossomosmais/atomium
Atomium is an internal design system for 'Juntos Somos Mais' using Web Components
Language: TypeScript - Size: 441 MB - Last synced at: 4 days ago - Pushed at: 4 days ago - Stars: 171 - Forks: 6
didoo/style-dictionary-demo
A demonstration of a setup of Style Dictionary to be used for the generation of design tokens
Language: JavaScript - Size: 195 KB - Last synced at: 24 days ago - Pushed at: over 2 years ago - Stars: 171 - Forks: 29
universal-design-tokens/udt
Universal Design Tokens (UDT) is a collection of libraries and utilities for working with DTCG design tokens files.
Language: TypeScript - Size: 2.48 MB - Last synced at: 3 days ago - Pushed at: 3 days ago - Stars: 160 - Forks: 3
5t3ph/a11y-color-tokens
Generate accessible UI colors from your base color tokens.
Language: JavaScript - Size: 21.5 KB - Last synced at: 13 days ago - Pushed at: over 1 year ago - Stars: 160 - Forks: 5
Talend/ui
Talend's unified web UI repository.
Language: JavaScript - Size: 95.1 MB - Last synced at: 4 days ago - Pushed at: 4 days ago - Stars: 154 - Forks: 53
visualjerk/vue-cion-design-system
CION - Design system boilerplate for Vue.js
Language: HTML - Size: 26.4 MB - Last synced at: 5 months ago - Pushed at: over 2 years ago - Stars: 143 - Forks: 24
lukasoppermann/style-dictionary-utils
Utilities to use in your style dictionary config
Language: TypeScript - Size: 666 KB - Last synced at: 11 months ago - Pushed at: 11 months ago - Stars: 138 - Forks: 14
nado1001/style-dictionary-tailwindcss-transformer
This is a plugin to generate the config of Tailwind CSS using Style Dictionary
Language: TypeScript - Size: 1.01 MB - Last synced at: 7 days ago - Pushed at: 7 days ago - Stars: 135 - Forks: 16
marigold-ui/marigold
Design System based on react-aria and Tailwind CSS
Language: TypeScript - Size: 203 MB - Last synced at: 3 days ago - Pushed at: 3 days ago - Stars: 126 - Forks: 11
mateoroldos/tokenbase
Create, manage and distribute design tokens.
Language: Svelte - Size: 9.19 MB - Last synced at: 21 days ago - Pushed at: 6 months ago - Stars: 123 - Forks: 7
Royal-Navy/design-system
Build web applications that meet the Royal Navy service standards
Language: TypeScript - Size: 216 MB - Last synced at: 1 day ago - Pushed at: 1 day ago - Stars: 122 - Forks: 31
Specifyapp/parsers
Specify helps you unify your brand identity by collecting, storing and distributing design tokens and assets — automatically.
Language: TypeScript - Size: 1.21 MB - Last synced at: 9 months ago - Pushed at: 10 months ago - Stars: 111 - Forks: 15
adobe/spectrum-tokens
Tokens used by Spectrum, Adobe's design system.
Language: JavaScript - Size: 4.48 MB - Last synced at: 2 days ago - Pushed at: 2 days ago - Stars: 107 - Forks: 20
peruvianidol/coolcss
The last CSS framework I'll (hopefully) ever have to make
Language: HTML - Size: 9.85 MB - Last synced at: 24 days ago - Pushed at: over 3 years ago - Stars: 107 - Forks: 8
fylgja/fylgja
The flexible and lightweight CSS library designed to streamline your web development.
Language: CSS - Size: 2.81 MB - Last synced at: 6 days ago - Pushed at: 14 days ago - Stars: 99 - Forks: 1
ingrammicro/puzzle-tokens
Batch create, manage and update Sketch styles and symbols using SCSS/LESS
Language: JavaScript - Size: 54.2 MB - Last synced at: about 2 years ago - Pushed at: over 2 years ago - Stars: 95 - Forks: 17
microsoft/figma-variables-import
Variables Import plugin for Figma
Language: TypeScript - Size: 225 KB - Last synced at: 6 days ago - Pushed at: 8 months ago - Stars: 91 - Forks: 11
almazrafi/Fugen
Command line tool for exporting resources and generating code from your Figma files
Language: Swift - Size: 2.96 MB - Last synced at: 24 days ago - Pushed at: over 1 year ago - Stars: 82 - Forks: 9
Convertiv/handoff-app
A toolchain for Figma design tokens, enabling designers and developers to extract, transform, and distribute design decisions as code
Language: TypeScript - Size: 6.75 MB - Last synced at: 8 days ago - Pushed at: 8 days ago - Stars: 81 - Forks: 5
opentable/design-tokens
A place where OpenTable engineers and designers openly work together
Language: JavaScript - Size: 20.2 MB - Last synced at: 5 days ago - Pushed at: about 1 year ago - Stars: 80 - Forks: 73
system-props/system-props
Responsive, theme-based style props for building design systems with React. Written in TypeScript.
Language: TypeScript - Size: 62.8 MB - Last synced at: 3 days ago - Pushed at: about 2 years ago - Stars: 79 - Forks: 8
bem/themekit
Build system of design-tokens for any platforms
Language: TypeScript - Size: 1.01 MB - Last synced at: 6 days ago - Pushed at: over 2 years ago - Stars: 74 - Forks: 11
wikimedia/design-codex
Codex is the Design System for Wikimedia. Codex features a toolkit for building user interfaces, containing design tokens, Vue 3 components and VitePress documentation site packages. This is a mirror from https://gerrit.wikimedia.org/g/design/codex/
Language: TypeScript - Size: 47 MB - Last synced at: 4 days ago - Pushed at: 4 days ago - Stars: 72 - Forks: 17
sammdec/theme-ui-native
Build consistent, themeable React Native apps based on constraint-based design principles
Language: JavaScript - Size: 886 KB - Last synced at: 1 day ago - Pushed at: over 2 years ago - Stars: 68 - Forks: 1
digital-go-jp/design-tokens
デジタル庁デザインシステムのデザイントークン
Language: TypeScript - Size: 577 KB - Last synced at: 20 days ago - Pushed at: about 1 month ago - Stars: 61 - Forks: 1
bcgov/design-system
The B.C. Design System helps public sector design and development teams build consistent, accessible products
Language: TypeScript - Size: 19.3 MB - Last synced at: 3 months ago - Pushed at: 3 months ago - Stars: 60 - Forks: 40
ui-js/chromatic
A build system for managing cross-platform design systems using design tokens.
Language: TypeScript - Size: 1.9 MB - Last synced at: 7 days ago - Pushed at: about 2 years ago - Stars: 60 - Forks: 0
mikaelvesavuori/figmagic-example
Using Figmagic (simplifying design token generation and asset extraction) with Webpack 5, React 16, Styled Components.
Language: TypeScript - Size: 5.28 MB - Last synced at: 22 days ago - Pushed at: over 2 years ago - Stars: 58 - Forks: 19
sbb-design-systems/lyne-components
Components for Lyne Design System
Language: TypeScript - Size: 117 MB - Last synced at: 6 days ago - Pushed at: 6 days ago - Stars: 52 - Forks: 13
tokens-bruecke/figma-plugin
TokensBrücke is a Figma plugin that converts Figma variables into design-tokens JSON.
Language: TypeScript - Size: 1.54 MB - Last synced at: 15 days ago - Pushed at: 15 days ago - Stars: 52 - Forks: 14
glrodasz/cero-components
Component library for Cero a Producción Project
Language: JavaScript - Size: 1.26 MB - Last synced at: 2 days ago - Pushed at: about 2 years ago - Stars: 52 - Forks: 23
nuxt-modules/design-tokens
Design tokens module for Nuxt
Language: TypeScript - Size: 521 KB - Last synced at: 6 days ago - Pushed at: 11 days ago - Stars: 51 - Forks: 3
gustavoquinalha/design-tokens-generator
Create your Semantic Style Variables (Universal language for developers and designers).
Language: Vue - Size: 3.66 MB - Last synced at: about 1 month ago - Pushed at: over 2 years ago - Stars: 50 - Forks: 8
nxkit/nxkit
Keyboard crafted https://nx.dev plugins for your workspace
Language: TypeScript - Size: 1.18 MB - Last synced at: 21 days ago - Pushed at: 5 months ago - Stars: 45 - Forks: 6
launchdarkly/launchpad-ui
:rocket: LaunchDarkly's design system
Language: TypeScript - Size: 25.3 MB - Last synced at: 4 days ago - Pushed at: 4 days ago - Stars: 42 - Forks: 7
microsoft/fluentui-token-pipeline
The Fluent UI token pipeline generates source code for Fluent UI libraries.
Language: TypeScript - Size: 667 KB - Last synced at: 6 days ago - Pushed at: 10 months ago - Stars: 42 - Forks: 18
VirtusLab/tetrisly-react
Tetrisly offers user-friendly components designed for effortless integration. Plus, it's fully compatible with Tetrisly for Figma with a seamless design and development experience in mind.
Language: TypeScript - Size: 31.3 MB - Last synced at: 11 days ago - Pushed at: about 1 month ago - Stars: 41 - Forks: 1
DAN-AKL/storybook-documentation-primitives
📚️ Custom DocBlocks for Storybook
Language: JavaScript - Size: 3.28 MB - Last synced at: 7 days ago - Pushed at: 8 days ago - Stars: 36 - Forks: 7
dash-ui/styles
≡𝘿𝙖𝙨𝙝 A tiny, powerful, framework-agnostic CSS-in-JS library
Language: TypeScript - Size: 2.08 MB - Last synced at: 9 days ago - Pushed at: over 1 year ago - Stars: 35 - Forks: 2
gavinmcfarland/mole
A tool for managing design decision outputs for different platforms
Language: JavaScript - Size: 5.06 MB - Last synced at: 1 day ago - Pushed at: 9 months ago - Stars: 33 - Forks: 4
arthyn/stitchwind 📦
A bridge between Tailwind and Stitches
Language: TypeScript - Size: 80.1 KB - Last synced at: 5 months ago - Pushed at: over 4 years ago - Stars: 33 - Forks: 0
snowball-tech/fractal
The open-source mono-repository for the design reference, components libraries and documentations of Fractal, Snowball's design system.
Language: TypeScript - Size: 13.9 MB - Last synced at: 5 days ago - Pushed at: 19 days ago - Stars: 30 - Forks: 3
theemo-tokens/theemo
Design Token Automations
Language: TypeScript - Size: 12 MB - Last synced at: 6 days ago - Pushed at: 7 days ago - Stars: 28 - Forks: 2
klaufel/figma-tokens
🎨 A light tool for generate Figma design tokens as variables.
Language: JavaScript - Size: 229 KB - Last synced at: 9 days ago - Pushed at: 3 months ago - Stars: 26 - Forks: 5
nclsndr/design-tokens-format-module
A Typescript implementation of the Design Tokens Format Module specification
Language: TypeScript - Size: 166 KB - Last synced at: 7 days ago - Pushed at: 4 months ago - Stars: 25 - Forks: 2
divriots/backlight.dev
Design Systems, Code-side
Size: 4.88 KB - Last synced at: 2 days ago - Pushed at: over 3 years ago - Stars: 25 - Forks: 1
michaelmang/tempera
A CLI toolkit for aiding design tokens adoption.
Language: JavaScript - Size: 2.86 MB - Last synced at: 3 days ago - Pushed at: about 4 years ago - Stars: 25 - Forks: 2
pattespatte/vanilla-css-design-system
Purely Vanilla: A Minimalist CSS Design System (no SCSS or JavaScript needed)
Language: CSS - Size: 648 KB - Last synced at: 9 days ago - Pushed at: 9 days ago - Stars: 24 - Forks: 0
AnimaApp/design-token-validator
Validate your design tokens
Language: TypeScript - Size: 225 KB - Last synced at: 19 days ago - Pushed at: almost 2 years ago - Stars: 24 - Forks: 0
nelonoel/postcss-theme-ui
PostCSS plugin for accessing Theme UI variables
Language: JavaScript - Size: 3.39 MB - Last synced at: 4 days ago - Pushed at: over 2 years ago - Stars: 22 - Forks: 0
shopware/meteor
Meteor is Shopware’s open-source design system that drives our commerce solutions. Extend and customise every aspect of Shopware – create elegant, delightful, and accessible experiences. There are no limits to your imagination.
Language: TypeScript - Size: 74.4 MB - Last synced at: 4 days ago - Pushed at: 4 days ago - Stars: 21 - Forks: 6
vrrashkov/TokenParser
Tool that converts your Figma tokens to any language made with Rust
Language: Rust - Size: 185 KB - Last synced at: 17 days ago - Pushed at: over 1 year ago - Stars: 21 - Forks: 2
ezavile/postcss-plugins
Monorepo that contains a set of PostCSS plugins.
Language: TypeScript - Size: 1.43 MB - Last synced at: 15 days ago - Pushed at: about 4 years ago - Stars: 21 - Forks: 2
kaelig/tokens2palettes-example
Example showing how to transform design tokens into color palettes usable by designers
Language: JavaScript - Size: 180 KB - Last synced at: 13 days ago - Pushed at: 4 months ago - Stars: 20 - Forks: 0
kaelig/google-spreadsheets-theo-demo
Design tokens, managed via Google Spreadsheets, generated using Theo
Language: JavaScript - Size: 203 KB - Last synced at: 13 days ago - Pushed at: 4 months ago - Stars: 19 - Forks: 1
AlaskaAirlines/AuroDesignTokens
Abstract UI atomic values to support the Auro Design System.
Language: JavaScript - Size: 1.87 MB - Last synced at: about 10 hours ago - Pushed at: about 10 hours ago - Stars: 18 - Forks: 7
rodydavis/material-design-lite Fork of google/material-design-lite 📦
Material Design Components in HTML/CSS/JS
Language: JavaScript - Size: 77 MB - Last synced at: 7 days ago - Pushed at: over 2 years ago - Stars: 18 - Forks: 1
diegosilvadigital/awesome-template-stitches
This project is a boilerplate for Next and TypeScript projects. This template was built with Vite, TypeScript and Stitches.
Language: TypeScript - Size: 889 KB - Last synced at: 11 days ago - Pushed at: over 2 years ago - Stars: 18 - Forks: 1
RedHat-UX/red-hat-design-tokens
Red Hat design tokens
Language: TypeScript - Size: 1.07 MB - Last synced at: about 24 hours ago - Pushed at: about 1 month ago - Stars: 17 - Forks: 2
bitcrowd/bitstyles
A complete design system, with base styles and components, built in Sass using CSS variables
Language: MDX - Size: 21.3 MB - Last synced at: 5 days ago - Pushed at: 4 months ago - Stars: 17 - Forks: 0
mercedes-benz/product-kit_core 📦
Product Kit Core provides design tokens for the Mercedes-Benz Tech Innovation styleguide.
Language: JavaScript - Size: 699 KB - Last synced at: 2 days ago - Pushed at: over 1 year ago - Stars: 17 - Forks: 5
Sage/design-tokens
Design tokens for the Sage Design system using Amazon Style Dictionary.
Language: TypeScript - Size: 11.4 MB - Last synced at: 8 days ago - Pushed at: 9 days ago - Stars: 16 - Forks: 9
telekom/design-tokens
The source of truth for designing Telekom-branded digital products
Language: JavaScript - Size: 3.93 MB - Last synced at: 9 days ago - Pushed at: over 1 year ago - Stars: 16 - Forks: 6
CityOfNewYork/patterns-cli
A front-end CLI for building and managing design pattern libraries. Maintained by @NYCOpportunity
Language: JavaScript - Size: 1.99 MB - Last synced at: 9 days ago - Pushed at: about 2 years ago - Stars: 15 - Forks: 1
icona79/sketch-design-tokens-exporter
Export Design Tokens from your Sketch document via plugin
Language: JavaScript - Size: 1.19 MB - Last synced at: about 1 year ago - Pushed at: over 2 years ago - Stars: 15 - Forks: 0
Runroom/design-tokens 📦
Runroom implementation of Figma design tokens
Language: TypeScript - Size: 1.28 MB - Last synced at: 6 days ago - Pushed at: 22 days ago - Stars: 14 - Forks: 2
bly-th/css
A truly versatile CSS toolkit.
Language: JavaScript - Size: 1.4 MB - Last synced at: 12 days ago - Pushed at: 6 months ago - Stars: 14 - Forks: 1
Design-System-Cookbooks/design-systems
Design System open-source database
Language: TypeScript - Size: 15 MB - Last synced at: 7 months ago - Pushed at: 7 months ago - Stars: 14 - Forks: 3
Zuehlke/design-system-starter
Language: TypeScript - Size: 1.93 MB - Last synced at: 13 days ago - Pushed at: 9 months ago - Stars: 14 - Forks: 1
deven-org/boiler
A fully customisable and tokenised design system boilerplate built by Accenture Song
Language: TypeScript - Size: 28.9 MB - Last synced at: 10 months ago - Pushed at: 10 months ago - Stars: 14 - Forks: 6
nuxt-themes/tokens
Design Tokens synced with Nuxt design team Figma.
Language: Vue - Size: 974 KB - Last synced at: 22 days ago - Pushed at: over 1 year ago - Stars: 13 - Forks: 2
dialpad/dialtone
The main repository for all of Dialpad's design system resources.
Language: JavaScript - Size: 244 MB - Last synced at: 1 day ago - Pushed at: 1 day ago - Stars: 12 - Forks: 3
kaelig/google-spreadsheets-theo
Import Google Spreadsheets to a format digestable by Theo
Language: JavaScript - Size: 938 KB - Last synced at: 13 days ago - Pushed at: 4 months ago - Stars: 12 - Forks: 0
newrelic/one-core-toolbox
A Figma plugin that simplifies the use of the One Core design system for New Relic designers (internal only).
Language: TypeScript - Size: 117 MB - Last synced at: 6 days ago - Pushed at: 8 months ago - Stars: 12 - Forks: 6
my-slab/design-tokens-graphql
Manage Design Tokens with GraphQL
Language: JavaScript - Size: 172 KB - Last synced at: about 2 years ago - Pushed at: over 2 years ago - Stars: 12 - Forks: 0
seljabali/ios-design-tokens
Design tokens visualized for iOS
Language: Swift - Size: 5.1 MB - Last synced at: about 2 years ago - Pushed at: over 3 years ago - Stars: 12 - Forks: 0
