Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

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...

realvjy's profile picture

vijay verma

35,704 subscribers

14,413 görüntüleme • 1 yıl önce •via X (Twitter)

SanatBilim & Teknoloji
LIVE

Anya Rossi• Live Now

Private livecam show

8 Yorum

vijay verma profil fotoğrafı
vijay verma1 yıl önce

Join here

RTTS profil fotoğrafı
RTTS2 yıl önce

Testing Salesforce presents unique challenges due to its complexity, scalability and customizability. ​ RTTS can plan, design & automate a successful testing process for you.

Diego Abel profil fotoğrafı
Diego Abel1 yıl önce

@figma Great video thumbnail!

vijay verma profil fotoğrafı
vijay verma1 yıl önce

@figma Thanks 🙌

koko profil fotoğrafı
koko1 yıl önce

@figma I signed up long time ago and didn’t get invite 🦦

vijay verma profil fotoğrafı
vijay verma1 yıl önce

@figma So, many request. I pick randomly. Will try to send in next batch. You can DM your email

Ana profil fotoğrafı
Ana1 yıl önce

@figma Niceeeee

design.ronit profil fotoğrafı
design.ronit1 yıl önce

@figma Ohhhh lovely man🔥🔥🫡

Benzer Videolar

I'm building a Figma plugin to generate design system variables/tokens 🛠️ After sharing the first demo, it grew too big, making it hard to manage and add new features. So, I restarted the project and cleaned up the code to make it easier to handle. Here’s detailed demo - It generate variable from preset and all alow to customize. Now, Just working on UI before final release I’ve already shared test version, who signed up. Let' me know if you wanna test.
1:19

I'm building a Figma plugin to generate design system variables/tokens 🛠️ After sharing the first demo, it grew too big, making it hard to manage and add new features. So, I restarted the project and cleaned up the code to make it easier to handle. Here’s detailed demo - It generate variable from preset and all alow to customize. Now, Just working on UI before final release I’ve already shared test version, who signed up. Let' me know if you wanna test.

vijay verma

21,818 görüntüleme • 1 yıl önce

What if you could generate all your colors, typography styles, sizes, radii, and more as variables and tokens with just one click? No manual setup, in few minutes go from blank page to a solid design system foundation. With option to present everything nicely for dev doc and more. With this Figma plugin, it’s actually that simple. ✨
1:46

What if you could generate all your colors, typography styles, sizes, radii, and more as variables and tokens with just one click? No manual setup, in few minutes go from blank page to a solid design system foundation. With option to present everything nicely for dev doc and more. With this Figma plugin, it’s actually that simple. ✨

vijay verma

26,263 görüntüleme • 7 ay önce

What if I told you that you can quickly present and document all your Figma tokens, variables, and styles in this layout—without any manual effort? I'm coding this new layout to automatically detect everything from design system and organize in different template …
0:42

What if I told you that you can quickly present and document all your Figma tokens, variables, and styles in this layout—without any manual effort? I'm coding this new layout to automatically detect everything from design system and organize in different template …

vijay verma

25,239 görüntüleme • 1 yıl önce

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 ⏰
2:12

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 görüntüleme • 3 yıl önce

Have you ever wanted a more granular view of how your styles are used in your design? Coming soon to my Figma Plugin, Design Lint 2.0 is a styles overview. Each style and its layers are selectable, making switching styles or finding styles being used incorrectly a breeze.
0:23

Have you ever wanted a more granular view of how your styles are used in your design? Coming soon to my Figma Plugin, Design Lint 2.0 is a styles overview. Each style and its layers are selectable, making switching styles or finding styles being used incorrectly a breeze.

Daniel Destefanis

15,419 görüntüleme • 3 yıl önce

I'm really excited about our new Figma feature, variables. So, I built a new plugin I call "Find Variables" to help you find where they're being used across your design. It will be free and open source once it's published to Figma community!
0:32

I'm really excited about our new Figma feature, variables. So, I built a new plugin I call "Find Variables" to help you find where they're being used across your design. It will be free and open source once it's published to Figma community!

Daniel Destefanis

75,900 görüntüleme • 3 yıl önce

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!
0:43

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,664 görüntüleme • 1 yıl önce

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! ....
1:47

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,416 görüntüleme • 1 yıl önce

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
3:12

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

96,137 görüntüleme • 3 ay önce

This Figma plugin will save you 90% of the time needed to build a design system in Figma!
0:23

This Figma plugin will save you 90% of the time needed to build a design system in Figma!

Jan Mraz

24,110 görüntüleme • 1 yıl önce

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
1:46

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.

49,425 görüntüleme • 1 yıl önce

Variables make your design consistent and flexible 🔥 Built this Light/Dark Dashboard in Figma using Variables for breakpoints. Giving away the Figma file with all variables set up. Comment 'Figma' & I will DM you the link (Must be follow so I can DM) #figma #UIDesign #process
0:25

Variables make your design consistent and flexible 🔥 Built this Light/Dark Dashboard in Figma using Variables for breakpoints. Giving away the Figma file with all variables set up. Comment 'Figma' & I will DM you the link (Must be follow so I can DM) #figma #UIDesign #process

Harshil Acharya

104,452 görüntüleme • 1 yıl önce

Do more with Dev Mode. This new plugin allows you to write and generate dynamic code snippets for your design system. Code Snippet Editor →
0:30

Do more with Dev Mode. This new plugin allows you to write and generate dynamic code snippets for your design system. Code Snippet Editor →

Figma

141,258 görüntüleme • 2 yıl önce

Working on color generator feature for design system Figma plugin, that creates all color shades based on a base color you pick or given hex. Different algorithms to generate more harmonious or complementary colors for your next design system project. Soon…
0:32

Working on color generator feature for design system Figma plugin, that creates all color shades based on a base color you pick or given hex. Different algorithms to generate more harmonious or complementary colors for your next design system project. Soon…

vijay verma

10,196 görüntüleme • 1 yıl önce

Today we’re launching an experimental Figma plugin that will convert your design into runnable code. Generate a Repl directly from Figma, and instantly share a static React app with your team. Then, use Replit AI to add functionality and get your code production-ready.
0:45

Today we’re launching an experimental Figma plugin that will convert your design into runnable code. Generate a Repl directly from Figma, and instantly share a static React app with your team. Then, use Replit AI to add functionality and get your code production-ready.

Replit ⠕

524,480 görüntüleme • 2 yıl önce

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.
2:55

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,497 görüntüleme • 1 yıl önce

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! ⚡
0:51

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,291 görüntüleme • 1 yıl önce

Built a new Figma plugin I call "Magic Messages". It generates entire conversations using ChatGPT and renders them using our design system at Discord. You can set a topic, # people talking, and # of messages. This way we can generate content for our designs more easily.
0:46

Built a new Figma plugin I call "Magic Messages". It generates entire conversations using ChatGPT and renders them using our design system at Discord. You can set a topic, # people talking, and # of messages. This way we can generate content for our designs more easily.

Daniel Destefanis

130,028 görüntüleme • 3 yıl önce