Video wird geladen...

Video konnte nicht geladen werden

Beim Laden dieses Videos ist ein Problem aufgetreten. Dies könnte an einem vorübergehenden Netzwerkproblem liegen oder das Video ist möglicherweise nicht verfügbar.

Found a dream plugin for making typography scales, it creates: – Variables – Styles with variables as values – Sticker sheet on the canvas And you can build ramps based on a ratio/calculation as well, saving a tonne of time

luis.

66,164 subscribers

49,425 Aufrufe • vor 1 Jahr •via X (Twitter)

Kunst Wissenschaft & Technologie Bildung

Anya Rossi• Live Now

Private livecam show

10 Kommentare

Profilbild von 👨‍🍳 Alexandre Broudin

👨‍🍳 Alexandre Broudinvor 1 Jahr

Thank you for the words! :) 2 updates coming: - UI redesign of the scale composition - Responsive mode, up to 5 media, half done

Profilbild von luis.

luis.vor 1 Jahr

Very exciting! Would also be great to be able to overwrite existing variables created from the plugin, instead of it always creating a new collection

Profilbild von 🐸 Tama - Multimedia Designer

🐸 Tama - Multimedia Designervor 1 Jahr

Okay, for the last couple days, I struggled to resize my frame cause of the font size, and your post popped up on my timeline. What an amazing algorithm lol

Profilbild von Alexia 🥐

Alexia 🥐vor 1 Jahr

Made in @abroudin ™️

Profilbild von jenn

jennvor 1 Jahr

oh my god thank you for this

Profilbild von Nasir Uddin

Nasir Uddinvor 1 Jahr

Just added it to my Figma! Anything that saves time with typography is a win in my book.

Profilbild von Juan Arreguin

Juan Arreguinvor 1 Jahr

Is there one for colors?!!! 👀

Profilbild von mihai

mihaivor 1 Jahr

This is a nice plugin, but I prefer to set everything by hand. This way I can better feel the project and give me time to digest ideas.

Profilbild von luis.

luis.vor 1 Jahr

Setting by hand is great! It would be work tweaking and workshopping by hand but then automating the tokens with the plugin would still save a tonne of time

Profilbild von Zach Shea

Zach Sheavor 1 Jahr

Awesome

Ähnliche Videos

Sharing a great tool here: The Genome Color Tool Is allows you to generate a colour palettes based on your brand, and then import those into Figma as styles You can then combine this with another plugin to spin variables up and save a tonne of time ⏰

luis.

22,029 Aufrufe • vor 2 Jahren

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.

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,495 Aufrufe • vor 1 Jahr

Present section Demo of Figma Plugin. This will print and document all variables and styles. I'm building a plugin to generate design system variables/styles from presets. Already shared test version, who signed up. Coming soon...

Present section Demo of Figma Plugin. This will print and document all variables and styles. I'm building a plugin to generate design system variables/styles from presets. Already shared test version, who signed up. Coming soon...

vijay verma

13,889 Aufrufe • vor 1 Jahr

Prompts shouldn’t be static. Introducing Prompt Variables. A way to build prompts that adapt to your inputs. Think of it as a text compositor: drop dynamic variables directly into your prompt, reorder them with drag-and-drop, and create new ones instantly with an @ sign. It means a cleaner workflow, and a cleaner canvas. 👉 See it in action:

Prompts shouldn’t be static. Introducing Prompt Variables. A way to build prompts that adapt to your inputs. Think of it as a text compositor: drop dynamic variables directly into your prompt, reorder them with drag-and-drop, and create new ones instantly with an @ sign. It means a cleaner workflow, and a cleaner canvas. 👉 See it in action:

Figma Weave

24,438 Aufrufe • vor 3 Monaten

Your new favourite plugin just dropped Styles ➡ Variables, by Yann-Edern Gillet Works like a charm:

Your new favourite plugin just dropped Styles ➡ Variables, by Yann-Edern Gillet Works like a charm:

luis.

58,777 Aufrufe • vor 3 Jahren

Excited to share Kigen Design System Figma plugin✨ Over the years, I’ve helped lots of brands build their DS - mostly doing the same variables and styles repeatedly for start. I thought, why not automate this? So, for the past few months, I’ve been building, testing, and improving it. Right now, it generates colors, typography styles, sizes, radii, and more. Plus, there’s an option to present everything for documentation. Give it a try and let me know what you think! ....

Excited to share Kigen Design System Figma plugin✨ Over the years, I’ve helped lots of brands build their DS - mostly doing the same variables and styles repeatedly for start. I thought, why not automate this? So, for the past few months, I’ve been building, testing, and improving it. Right now, it generates colors, typography styles, sizes, radii, and more. Plus, there’s an option to present everything for documentation. Give it a try and let me know what you think! ....

vijay verma

66,194 Aufrufe • vor 1 Jahr

Redid the prologue skipping mechanic. Now it both looks better and more cohesive with the game's UI, as well as function better. Instead of setting the variables as if you spent time with the character whose route you played last (which is nonsensical), it asks you instead.

Redid the prologue skipping mechanic. Now it both looks better and more cohesive with the game's UI, as well as function better. Instead of setting the variables as if you spent time with the character whose route you played last (which is nonsensical), it asks you instead.

Tennis Ace VN (tennisace.bsky.social)

20,104 Aufrufe • vor 1 Jahr

#Config2023 Launch 2: Variables You can now use variables to make adaptable designs—we’re talking different brand themes, device formats, and more. And yup, variables can be exported as tokens in case that’s helpful 😉. 👇 See variables in action

Figma

357,641 Aufrufe • vor 3 Jahren

Say hello to the latest game-changer in Supa Palette 4.0 for @Figma! Fully customizable popular color systems you can save as variables or styles. Save hours—just a few clicks and you're all set! ⚡

Say hello to the latest game-changer in Supa Palette 4.0 for @Figma! Fully customizable popular color systems you can save as variables or styles. Save hours—just a few clicks and you're all set! ⚡

Angelo Libero

29,104 Aufrufe • vor 1 Jahr

I made this tool 4 years ago for helping with customer support emails. Instead of typing, it allows you to compose an email by dragging from predefined blocks with variables. So you only write your blocks once, and then you only combine them with drag and drop into an email. You can also save a set of email blocks as a template. When you choose that template, it lets you fill the variables of the template like a form, and then send it. We only use it internally and now with all the gpt stuff going on it seems pointless to release it. or is it? 🤔

I made this tool 4 years ago for helping with customer support emails. Instead of typing, it allows you to compose an email by dragging from predefined blocks with variables. So you only write your blocks once, and then you only combine them with drag and drop into an email. You can also save a set of email blocks as a template. When you choose that template, it lets you fill the variables of the template like a form, and then send it. We only use it internally and now with all the gpt stuff going on it seems pointless to release it. or is it? 🤔

kitze the 🐐

72,423 Aufrufe • vor 3 Jahren

Published a plugin! It allows you to copy CSS variables from Figma in either design or dev mode 🧑‍💻

Published a plugin! It allows you to copy CSS variables from Figma in either design or dev mode 🧑‍💻

luis.

12,061 Aufrufe • vor 1 Jahr

Don’t waste time creating manual styles and variables in Figma!

Don’t waste time creating manual styles and variables in Figma!

Jan Mraz

17,169 Aufrufe • vor 9 Monaten

I'm tinkering away on a new Figma widget for design system auditing ⚙️ It scans your document and tells you: – Number of components – Components without descriptions / doc links – Components without variables / styles – Instances with overrides Hopefully published next week!

I'm tinkering away on a new Figma widget for design system auditing ⚙️ It scans your document and tells you: – Number of components – Components without descriptions / doc links – Components without variables / styles – Instances with overrides Hopefully published next week!

luis.

18,591 Aufrufe • vor 11 Monaten

BIG YCH PROJECT I'VE BEEN WORKING ON FOR A LONG TIME! You can now be on the same subway train as the giant fox! To claim a spot please DM and we can discuss further on Discord. Any kind of OC is ok! Size can be changed as well. (Not too big for the canvas pls) ✿4/4 spots open

Sensitive content

BIG YCH PROJECT I'VE BEEN WORKING ON FOR A LONG TIME! You can now be on the same subway train as the giant fox! To claim a spot please DM and we can discuss further on Discord. Any kind of OC is ok! Size can be changed as well. (Not too big for the canvas pls) ✿4/4 spots open

ida / commissions OPEN

329,655 Aufrufe • vor 2 Jahren

After so much experimentation and playing around with variables in Figma, thanks to chad, I think I finally found the most *efficient and easy* way to migrate existing component libraries from styles to variables. 🎛️⚡

After so much experimentation and playing around with variables in Figma, thanks to chad, I think I finally found the most efficient and easy way to migrate existing component libraries from styles to variables. 🎛️⚡

Joey Banks

124,210 Aufrufe • vor 3 Jahren

@ollybromham For the time, I just had a hunch how it should move and feel. I pulled some of the variables into sliders and built a little 'design tool' which allowed me to fidget around with the values and feel it out (this makes SwiftUI such a neat prototyping tool!) :-)

@ollybromham For the time, I just had a hunch how it should move and feel. I pulled some of the variables into sliders and built a little 'design tool' which allowed me to fidget around with the values and feel it out (this makes SwiftUI such a neat prototyping tool!) :-)

Alex Widua

10,819 Aufrufe • vor 2 Jahren

I built a Figma plugin that extracts local styles (tokens and variables) and generates DESIGN md and SKILL md files that you can integrate with any AI tool 💻 open-source under MIT license 🤖 works with all major AI tools 🚀 local algorithm without API calls

I built a Figma plugin that extracts local styles (tokens and variables) and generates DESIGN md and SKILL md files that you can integrate with any AI tool 💻 open-source under MIT license 🤖 works with all major AI tools 🚀 local algorithm without API calls

Zoltán Szőgyényi

95,109 Aufrufe • vor 1 Monat

A big mistake I see people routinely making is NOT clearly defining a time horizon prior to an investment/trade. Your time horizon for a trade is dictated by the longevity of the variables that trigger price action. i.e. $BTC is a long term hold due to the debasement of fiat + passive ETF bid over time (the variables here take years to play out) The same can be applied to a short term trade (the variables could be fast-moving). Full thoughts below.

A big mistake I see people routinely making is NOT clearly defining a time horizon prior to an investment/trade. Your time horizon for a trade is dictated by the longevity of the variables that trigger price action. i.e. $BTC is a long term hold due to the debasement of fiat + passive ETF bid over time (the variables here take years to play out) The same can be applied to a short term trade (the variables could be fast-moving). Full thoughts below.

Miles Deutscher

52,180 Aufrufe • vor 1 Jahr