Setting up SPACING & RADIUS TOKENS using Figma Variables!
12.3K views on YouTube
๐ Get 2 free months of Skillshare Premium & watch my design course for free: https://skl.sh/2TVhf8z
In this video, I demonstrate how to create Figma variables radius and spacing tokens. I explore various design systems like Uber, Atlassian, Microsoft, Spotify, and Shopify to understand their approaches to spacing and corner radius. Then, I will show how to set up and apply radius and spacing tokens in Figma, ensuring consistency and flexibility in design elements. By using variables, we can easily update and maintain styles throughout the design system.
๐ The Ultimate Guide to Become a Product Designer: https://learnproduct.design
๐ Create an account on Mobbin for free:
https://mobbin.com/?via=chethan
๐ถ Chapters
00:00 Introduction
01:07 Benchmarking
06:04 Creating Radius Tokens
10:46 Creating Spacing Tokens
—————————————ยญ—-
Mega Product Design Course for Beginners:
Webflow Course for Beginners:
Photoshop Tutorials:
Illustrator Tutorials:
After Effects Tutorials:
UI Design Tutorials:
Design Resources, Tools and Softwares:
Adobe XD CC Tutorials:
eSports Design Tutorials:
——————————————————————————————–
Contact me :
Portfolio: https://chethankvs.design
Twitter: https://twitter.com/kvschethan
Instagram: https://instagram.com/design_pilot
Mail: designpilot21@gmail.com
Behance: https://behance.net/chethankvs
Dribbble: https://dribbble.com/chethankvs
——————————————————————————————–
LIKE, SHARE, COMMENT & SUBSCRIBE ๐