made with react.js

#Utilities
icon-eye-dark Created with Sketch. 770

Figmagic

Generate Tokens for your Design System from Figma

Visit Site

Description

Generate Tokens for your Design System from Figma

"Generate design tokens, export graphics, and extract design token-driven React components from your Figma documents.

Figmagic promotes a structured way of assembling design systems. Following the primary principle of atomic design, Figmagic wants you to build from the bottom up, beginning with decomposing the tokens. Tokens shape elements, which form components, that are ordered in compositions, which get presented in views... You know the drill.

Code generation is done into React files, Styled Components, Storybook, CSS (css-in-js type) and markdown descriptions."

Creator

Mikael Vesavuori

Social Media Links

Related Projects


SWR React Hooks for Remote Data Fetching
#Utilities
icon-eye-dark Created with Sketch. 2.436
Rest Hooks Data Fetching Framework
#Utilities
icon-eye-dark Created with Sketch. 303
Sentry for React React Application Monitoring
💙 Sponsored by Friends
We’re hosting on Digital Ocean! 💙 Try it today and get a free $100 credit.
try now
Interweave Safely render HTML in React
#Utilities
icon-eye-dark Created with Sketch. 383
Recoil State Management Library
#Utilities
icon-eye-dark Created with Sketch. 814
View all Projects
COMMUNITY SPONSORS
Storyblok is a headless CMS offering powerful APIs and visual editing for the content in your React & Next.js projects Learn more Placid is a creative automation API & toolkit that lets you generate custom visuals at scale Learn more The JSCharting data visualization library includes 150+ advanced chart types that you can seamlessly use in your React apps Learn more React application monitoring by Sentry provides actionable insights to resolve performance bottlenecks and errors Learn more Bryntum offers a modern web component suite including a grid, scheduler, calendar & more – all integrating with React Learn more