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

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

На главную

Working with variables in Figma is so much fun! 🤩 It’s becoming clear that variables and components are essential for building any website or app today. True? #figma #designsystem #components #variables

34,885 просмотров • 1 год назад •via X (Twitter)

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

Фото профиля Fabian Albert
Fabian Albert1 год назад

@figma how would this help you in building websites? i’m curious, seems like a complete waste of time to me ( yes I am building websites )

Фото профиля Harshil Acharya
Harshil Acharya1 год назад

@figma If you get a chance to work on bigger projects (websites, ecommerce websites, webapp) like 40-50 pages, Variables help a lot. Learn it, try to use it and thank me later 🙃

Фото профиля Rajnish Sharma
Rajnish Sharma1 год назад

@figma Nice, possible to get plug-in name?

Фото профиля Harshil Acharya
Harshil Acharya1 год назад

@figma It’s Variable! Not any Plugin. :)

Фото профиля Daniel Alfred 🖥
Daniel Alfred 🖥1 год назад

@figma Please can I full tutorials on how you achieve this

Фото профиля Prashant Bajgire
Prashant Bajgire1 год назад

@figma I recently started learning it, and it's really fascinating, though a bit complex. I feel it requires logical thinking and a bit of basic math as well.

Фото профиля Harshil Acharya
Harshil Acharya1 год назад

@figma Yeah once you adopt the logic and used to with same, you can produce things in a great way. )

Фото профиля Asem H.
Asem H.1 год назад

@figma What do you mean it is “becoming” clear components are essential? Components has been a way to build software since decades and they existed in Sketch (which predated Figma) as Symbols. Everyone has been using them in design since years.

Фото профиля Nicholas Asher
Nicholas Asher1 год назад

@figma I think it’s fine to use styles if you don’t plan on using variables for referencing other variables and it’s a once off project. Spending loads of time on variables for the sake of it could be a waste of time and money.

Фото профиля 黄佳豪
黄佳豪1 год назад

@figma It's like mixing crypto cocktails 😎🍹

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

CSS variables are live and they are POWERFUL. Now Live on Product Hunt 🚀 ➡️ Create a design system "So you can stay consistent and build much quicker." Define global styles like colors, gradients, sizes, and box shadows. ➡️ Use your variables everywhere "So you never have to manually enter a border color again." You're not limited to just sizes, colors, and font families. Use variables in gradients, box shadows, transforms, and more! ➡️ Start with libraries like Open Props, expertly crafted CSS variables "So you can use a tried and true system, and so we can standardize our Projects." Because there are no abstractions, you can use existing CSS variable libraries like Open Props, an expertly crafted library of CSS variables, and the recommended starting point in Webstudio. ➡️ Create complex micro-interactions "So when you hover a link, you can change any children's styles." CSS variables go beyond reusability! You can define variables anywhere in the navigator, such as on a link, and modify the variables on hover. Then, you can use those variables on the children to create complex micro-interactions! ➡️ Design and build simultaneously "So when deciding that perfect border color, you can arrow through all your options." Experimenting on the canvas just got a whole lot better. Now, you can arrow through your variables and see them rendered on the canvas to see which works best. ➡️ Change variable by breakpoint "So you can make the variables look great, no matter the screen size." CSS variables in Webstudio use the same UI as the rest of your styles, enabling breakpoints to work the same way. ✨ Building with design systems gives a HUGE boost in speed, consistency, and maintainability.

Webstudio

15,496 просмотров • 1 год назад