Загрузка видео...

Не удалось загрузить видео

На главную

Hey 👋 designers, Here’s a quick tutorial on how to create light and dark mode designs in Figma using the color variable system. Retweet and Share with your fellow designers.

Tegadesigns's profile picture

UxUi.Tega

12,791 subscribers

12,043 просмотров • 11 месяцев назад •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

Комментарии: 11

Фото профиля UxUi.Tega
UxUi.Tega11 месяцев назад

Drop your questions in the comments, maybe I can do a part 2 for it. ⬇️⬇️

Фото профиля BeingAmarachi | Framer Developer
BeingAmarachi | Framer Developer11 месяцев назад

Very helpfulllllllllll💜

Фото профиля UxUi.Tega
UxUi.Tega11 месяцев назад

Glad it was

Фото профиля PB🌺 product design 💻
PB🌺 product design 💻11 месяцев назад

But this feature last I checked is only available to paid figma

Фото профиля UxUi.Tega
UxUi.Tega11 месяцев назад

Available on student Figma too

Фото профиля ODIANOSEN
ODIANOSEN11 месяцев назад

@UI_UXNonye

Фото профиля Digitalbimpe
Digitalbimpe11 месяцев назад

What’s your YouTube handle ???

Фото профиля Ginny - Designer | Framer Enthusiast
Ginny - Designer | Framer Enthusiast11 месяцев назад

Thank youuuuuuuu 🥹

Фото профиля UxUi.Tega
UxUi.Tega11 месяцев назад

You’re welcome

Фото профиля Boluwatife David
Boluwatife David11 месяцев назад

Can't style guide do this same thing ?

Фото профиля UxUi.Tega
UxUi.Tega11 месяцев назад

No , you can’t create color modes using color style

Похожие видео

This is how a top designer designs for light and dark mode in Figma The way he is using tokens, variables in Figma is insane 🤯 Loren Baxter shows how he designed light and dark modes for Felt in Figma 👇
2:12

This is how a top designer designs for light and dark mode in Figma The way he is using tokens, variables in Figma is insane 🤯 Loren Baxter shows how he designed light and dark modes for Felt in Figma 👇

Jayneil Dalal

75,835 просмотров • 1 год назад

If You're A UI UX Designer, I Just released a video demonstrating how to set up Dark Mode for your designs using Color Variables in Figma And CSS Watch Video Here :
0:43

If You're A UI UX Designer, I Just released a video demonstrating how to set up Dark Mode for your designs using Color Variables in Figma And CSS Watch Video Here :

Joseph Brendan

27,056 просмотров • 1 год назад

Another quick Figma tutorial to create this animation using variable and conditions 🥤. Small video to create this included. And get the code cheatsheet shared below. ✨
2:38

Another quick Figma tutorial to create this animation using variable and conditions 🥤. Small video to create this included. And get the code cheatsheet shared below. ✨

vijay verma

139,422 просмотров • 2 лет назад

UI/UX Designers, did you know you can get real-time UX/UI feedback on your designs and gather valuable insights directly in Figma? Spec AI is a Figma plugin that allows you to get real-time UX/UI feedback, helping you refine your designs and create user-centred experiences directly within Figma with just one click. Repost to share with others 💜
0:33

UI/UX Designers, did you know you can get real-time UX/UI feedback on your designs and gather valuable insights directly in Figma? Spec AI is a Figma plugin that allows you to get real-time UX/UI feedback, helping you refine your designs and create user-centred experiences directly within Figma with just one click. Repost to share with others 💜

Abraham John 🦄🦓

56,500 просмотров • 1 год назад

UI/UX Designers, did you know you can get real-time UX/UI feedback on your designs and gather valuable insights directly in Figma? Spec AI is a Figma plugin that allows you to get real-time UX/UI feedback, helping you refine your designs and create user-centred experiences directly within Figma with just one click. Repost to share with others 💜
0:33

UI/UX Designers, did you know you can get real-time UX/UI feedback on your designs and gather valuable insights directly in Figma? Spec AI is a Figma plugin that allows you to get real-time UX/UI feedback, helping you refine your designs and create user-centred experiences directly within Figma with just one click. Repost to share with others 💜

Abraham John 🦄🦓

28,726 просмотров • 1 год назад

Designers, stop manually prototyping your Figma designs, instead turn your design into realistic prototypes with Figma Make. Here’s my step-by-step process: prepare your Figma design, select the screens and send it to Figma Make, enter a prompt to generate a prototype using the reference design, and in seconds you’ll get a realistic UI prototype that stays true to your original design. Bookmark it for later 💜
0:24

Designers, stop manually prototyping your Figma designs, instead turn your design into realistic prototypes with Figma Make. Here’s my step-by-step process: prepare your Figma design, select the screens and send it to Figma Make, enter a prompt to generate a prototype using the reference design, and in seconds you’ll get a realistic UI prototype that stays true to your original design. Bookmark it for later 💜

Abraham John 🦄🦓

29,851 просмотров • 4 месяцев назад

Switch designs from light to dark mode in Figma, supafast! ⚡️
0:39

Switch designs from light to dark mode in Figma, supafast! ⚡️

Zander Whitehurst

235,830 просмотров • 3 лет назад

Check Designs: Keep every file synced to your design system with → Variable & style suggestions → Color contrast suggestions → Library mismatch detection → Detached component detection
0:57

Check Designs: Keep every file synced to your design system with → Variable & style suggestions → Color contrast suggestions → Library mismatch detection → Detached component detection

Figma

92,982 просмотров • 23 дней назад

This is how a top designer uses Figma variable modes to manage a design system for 50+ sports brands Designers should copy this workflow to scale their Figma design systems 👀 Watch the full video on Sneak Peek: Cornelius Hegeman shows how the Jump design team built a Figma design system to manage 50+ brands 👇
3:22

This is how a top designer uses Figma variable modes to manage a design system for 50+ sports brands Designers should copy this workflow to scale their Figma design systems 👀 Watch the full video on Sneak Peek: Cornelius Hegeman shows how the Jump design team built a Figma design system to manage 50+ brands 👇

Jayneil Dalal

29,057 просмотров • 4 месяцев назад

AI will not replace designers? Right? Screenshots to editable Figma Designs
0:30

AI will not replace designers? Right? Screenshots to editable Figma Designs

dudu

335,036 просмотров • 1 год назад

⚠️Designers⚠️ Here’s a quick and easy way to make professional looking lighting in Photoshop
0:28

⚠️Designers⚠️ Here’s a quick and easy way to make professional looking lighting in Photoshop

Spencer Hogan

22,678 просмотров • 12 дней назад

A quick tutorial on using the Figma MCP server with Windsurf!
3:03

A quick tutorial on using the Figma MCP server with Windsurf!

Windsurf is now Devin Desktop

113,296 просмотров • 1 год назад

This is how the Figma design team does silent design critiques in Figma Why silent? To give introvert designers a chance to share their ideas! Tammy Taabassum shows how to do a silent design crit in Figma 👇
2:01

This is how the Figma design team does silent design critiques in Figma Why silent? To give introvert designers a chance to share their ideas! Tammy Taabassum shows how to do a silent design crit in Figma 👇

Jayneil Dalal

53,342 просмотров • 1 год назад

UI/UX Designers, did you know you can convert your PNG images to SVG format and customize the colors directly in Figma? Quick Tracing is a Figma plugin that allows you to easily trace and convert images into vector shapes directly within Figma with just one click.
0:30

UI/UX Designers, did you know you can convert your PNG images to SVG format and customize the colors directly in Figma? Quick Tracing is a Figma plugin that allows you to easily trace and convert images into vector shapes directly within Figma with just one click.

Abraham John 🦄🦓

71,682 просмотров • 1 год назад

Last week, we launched our brand new Figma plugin, now used by 325,000+ designers! Here’s a quick video walkthrough of what’s new: import multiple frames at once and work seamlessly with Figma Slides to make your presentations more engaging. Check it out! 👇
3:25

Last week, we launched our brand new Figma plugin, now used by 325,000+ designers! Here’s a quick video walkthrough of what’s new: import multiple frames at once and work seamlessly with Figma Slides to make your presentations more engaging. Check it out! 👇

Robi

18,482 просмотров • 1 год назад

Designers, do you know that you can now turn your Figma design into an interactive prototype 10x faster without prototyping manually. Figma Make is a new AI-powered prompt-to-app tool that transforms designs and ideas into clickable prototypes in minutes. It’s made for designers, builders, and non-technical founders who want to move fast. Bookmark it for later 💜
1:17

Designers, do you know that you can now turn your Figma design into an interactive prototype 10x faster without prototyping manually. Figma Make is a new AI-powered prompt-to-app tool that transforms designs and ideas into clickable prototypes in minutes. It’s made for designers, builders, and non-technical founders who want to move fast. Bookmark it for later 💜

Abraham John 🦄🦓

145,429 просмотров • 7 месяцев назад

Me: Struggling to center a rectangle on Figma Other designers:
0:47

Me: Struggling to center a rectangle on Figma Other designers:

Jim Raptis

427,216 просмотров • 1 год назад

Designers can now ship UI directly. Vlad, our co-founder and designer, goes from Figma concept to AI fine-tuning in the live app using Cursor and Figma MCP. No more back and forth with engineers for a pixel-perfect result.
0:25

Designers can now ship UI directly. Vlad, our co-founder and designer, goes from Figma concept to AI fine-tuning in the live app using Cursor and Figma MCP. No more back and forth with engineers for a pixel-perfect result.

Alex Barashkov

37,789 просмотров • 4 месяцев назад

working with a combination of variables, modes, base components, and themed instances to explore designs in light and dark mode at the same time 🔊
0:32

working with a combination of variables, modes, base components, and themed instances to explore designs in light and dark mode at the same time 🔊

David Hill

18,858 просмотров • 8 месяцев назад