Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

Save this Figma prompt if you want to generate a full button component system with Auto Layout, sizes, states, variants, and reusable structure in 60 seconds. Copy and use this 👇

desgnwitkinsley's profile picture

designwithkingsley

9,934 subscribers

45,475 görüntüleme • 10 gün önce •via X (Twitter)

SanatEğitimBilim & Teknoloji
LIVE

Anya Rossi• Live Now

Private livecam show

0 Yorum

Yorum bulunmuyor

Orijinal gönderinin yorumları burada görünecek

Benzer Videolar

Quick Figma tip Use Shift + M to measure spacing as you adjust This makes dialing in your line height and auto layout container sizes much easier
0:29

Quick Figma tip Use Shift + M to measure spacing as you adjust This makes dialing in your line height and auto layout container sizes much easier

MDS

78,626 görüntüleme • 10 ay önce

figma "god mode" just leaked.. this week i tried the future of autonomous design: claude connected directly to the figma api with full edit access.. yes it can design in figma what does it mean? you prompt, it designs. it’s like having a team of designers inside figma working with you and 10x ing your capacity ​why is this different? ​official figma ai/mcp only "reads" files to help devs. this tool (unofficial MCP) "writes" in figma to replace manual labor. hours of grinding turned into seconds of waiting ​imagine this: - ​prompt to design: generate a new screen based on your design or not - prompt to flow: generate end to end user journeys - iteration: create multiple variations in one click - design system: it can use your components to create new screens - ​zero click management: auto layout, component creation, deduplication handled by prompt - ​universal control: if you can do it in figma, it can do it for you ​the impact ​if figma officially releases this, almost every existing plugin becomes obsolete overnight it feels like figma on steroids. i’m still processing whether i feel empowered or replaced ​full tutorial in this article from Mark A. Cianfrani. handle with care: ai will have access to everything in figma »
0:48

figma "god mode" just leaked.. this week i tried the future of autonomous design: claude connected directly to the figma api with full edit access.. yes it can design in figma what does it mean? you prompt, it designs. it’s like having a team of designers inside figma working with you and 10x ing your capacity ​why is this different? ​official figma ai/mcp only "reads" files to help devs. this tool (unofficial MCP) "writes" in figma to replace manual labor. hours of grinding turned into seconds of waiting ​imagine this: - ​prompt to design: generate a new screen based on your design or not - prompt to flow: generate end to end user journeys - iteration: create multiple variations in one click - design system: it can use your components to create new screens - ​zero click management: auto layout, component creation, deduplication handled by prompt - ​universal control: if you can do it in figma, it can do it for you ​the impact ​if figma officially releases this, almost every existing plugin becomes obsolete overnight it feels like figma on steroids. i’m still processing whether i feel empowered or replaced ​full tutorial in this article from Mark A. Cianfrani. handle with care: ai will have access to everything in figma »

Aurelien

78,970 görüntüleme • 4 ay önce

You can make your Figma designs functional with Claude AI Select component, go to Dev Mode and use Figma to Code plugin to turn to React/Tailwind. Copy the code and paste to Claude AI. Prompt "Create this component and center it". Then, "Make this functional", "Add rounded corners", "add hover states", "animate transitions". Don't forget to ask "always give full code". Otherwise, it might break the Artifact.
6:06

You can make your Figma designs functional with Claude AI Select component, go to Dev Mode and use Figma to Code plugin to turn to React/Tailwind. Copy the code and paste to Claude AI. Prompt "Create this component and center it". Then, "Make this functional", "Add rounded corners", "add hover states", "animate transitions". Don't forget to ask "always give full code". Otherwise, it might break the Artifact.

Meng To

171,763 görüntüleme • 1 yıl önce

If you want to design faster in Figma, Use blocks. → A free library of ready-to-use Figma UI blocks. Copy any component, paste it into your file, and start building instantly. Perfect for landing pages, layouts, and UI sections. Use it for: • landing page sections • UI components • layout structures • quick prototypes • design inspiration you can actually use Stop designing everything from scratch.
1:14

If you want to design faster in Figma, Use blocks. → A free library of ready-to-use Figma UI blocks. Copy any component, paste it into your file, and start building instantly. Perfect for landing pages, layouts, and UI sections. Use it for: • landing page sections • UI components • layout structures • quick prototypes • design inspiration you can actually use Stop designing everything from scratch.

Kailash

82,707 görüntüleme • 22 gün önce

Addicted to Nous Research Hermes Agent's /learn. You can feed it any design and turn it into a reusable skill that makes Hermes design exactly how you want. /learn [URL or image] - extracts design tokens, layout structure, interaction states, component patterns, and a 10-point checklist Next time you want that exact style, just ask Hermes to use the skill it created. Example below 👇
0:29

Addicted to Nous Research Hermes Agent's /learn. You can feed it any design and turn it into a reusable skill that makes Hermes design exactly how you want. /learn [URL or image] - extracts design tokens, layout structure, interaction states, component patterns, and a 10-point checklist Next time you want that exact style, just ask Hermes to use the skill it created. Example below 👇

Mia

75,234 görüntüleme • 13 gün önce

Component style variants are here! You can now define multiple style options for a single component — like a Button with solid and outline styles, a Card with horizontal and vertical variants, and more 🤯 Read more in the updates post:
0:33

Component style variants are here! You can now define multiple style options for a single component — like a Button with solid and outline styles, a Card with horizontal and vertical variants, and more 🤯 Read more in the updates post:

Webflow

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

Recently, I've recreated this metallic button in Figma shared by Jordan Singer Felt like it should be a shadcn component, so now it is! That too with 6 variants! Check out:
0:57

Recently, I've recreated this metallic button in Figma shared by Jordan Singer Felt like it should be a shadcn component, so now it is! That too with 6 variants! Check out:

Lakshay Bhushan

15,845 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,246 görüntüleme • 6 ay önce

Introducing: Light (god) Rays Component for Framer. Use this component to add this effect to your site in 30 seconds. Customizable intensity, color, and animation. Comment "LIGHT" and I’ll send you the component :)
0:20

Introducing: Light (god) Rays Component for Framer. Use this component to add this effect to your site in 30 seconds. Customizable intensity, color, and animation. Comment "LIGHT" and I’ll send you the component :)

Framer University

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

The new Composer model makes Cursor + Figma incredibly fast. This button component took only 30 seconds at 1x speed.
0:37

The new Composer model makes Cursor + Figma incredibly fast. This button component took only 30 seconds at 1x speed.

Wojciech Zieliński

32,287 görüntüleme • 8 ay önce

Google just quietly killed copy-paste for devs. This Stitch + Gemini 3.0 update is actually wild. Google Stitch now lets you: → Describe your app in plain text → Generate a full UI with buttons, forms, pages → Hit one export button → Open AI Studio with all HTML, screens and context preloaded → Let Gemini 3 write and debug the code for you You go from “idea in your head” → “working product” in about an hour instead of days. Freelancers, agencies, solopreneurs… this is your unfair advantage if you actually learn how to use it. Save this video, you’ll copy this workflow later. Want the SOP? Send me a DM. 💬
11:03

Google just quietly killed copy-paste for devs. This Stitch + Gemini 3.0 update is actually wild. Google Stitch now lets you: → Describe your app in plain text → Generate a full UI with buttons, forms, pages → Hit one export button → Open AI Studio with all HTML, screens and context preloaded → Let Gemini 3 write and debug the code for you You go from “idea in your head” → “working product” in about an hour instead of days. Freelancers, agencies, solopreneurs… this is your unfair advantage if you actually learn how to use it. Save this video, you’ll copy this workflow later. Want the SOP? Send me a DM. 💬

Julian Goldie SEO

32,975 görüntüleme • 7 ay önce

Save this video and do it every day before going to bed 🛌 🧠 ✅️ Want more calm, energy and better sleep in just 60 seconds?👇👇👇
0:50

Save this video and do it every day before going to bed 🛌 🧠 ✅️ Want more calm, energy and better sleep in just 60 seconds?👇👇👇

ᴀʀᴛ ᴏꜰ ᴘʜʏꜱɪQᴜᴇ

30,153 görüntüleme • 4 ay önce

The fastest way to design & build a website with the help of AI ✨ → Sitemaps in seconds → Wireframes with copy in minutes → Paste in to Figma & Webflow Powered by a design system of 1000+ components to generate production-quality websites
0:50

The fastest way to design & build a website with the help of AI ✨ → Sitemaps in seconds → Wireframes with copy in minutes → Paste in to Figma & Webflow Powered by a design system of 1000+ components to generate production-quality websites

Relume

776,758 görüntüleme • 2 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,234 görüntüleme • 2 yıl önce

3 design system updates for you → Hide & show variable paints → Go-to-main component shortcut → Duplicate & copy styles
0:30

3 design system updates for you → Hide & show variable paints → Go-to-main component shortcut → Duplicate & copy styles

Figma

139,793 görüntüleme • 1 yıl önce

A good design workflow should create more clarity, not more tabs. That is why OptimAI Claw is useful. One prompt can now help automate parts of your workflow on Figma and Stitch -- from research and structure to faster execution inside the tools you already use. “Turn this idea into a clean landing page concept. Draft the layout in Figma. Generate a matching flow in Stitch.” Less switching. Less friction. More room to think. That is what agentic AI should feel like: quiet, useful, and already inside the workflow. OptimAI Claw is built for that. --- 💡Launch OptimAI Claw with Core Node v2:
1:54

A good design workflow should create more clarity, not more tabs. That is why OptimAI Claw is useful. One prompt can now help automate parts of your workflow on Figma and Stitch -- from research and structure to faster execution inside the tools you already use. “Turn this idea into a clean landing page concept. Draft the layout in Figma. Generate a matching flow in Stitch.” Less switching. Less friction. More room to think. That is what agentic AI should feel like: quiet, useful, and already inside the workflow. OptimAI Claw is built for that. --- 💡Launch OptimAI Claw with Core Node v2:

OptimAI Network

183,810 görüntüleme • 1 ay önce

i built a tool that lets you clone ANY video with AI saw a movie scene you want to recreate? a commercial? a music video? just upload it to this tool and get the exact structured prompt to generate it in sora 2 you no longer need to guess how to describe what you want to generate. show the tool the reference and it engineers the prompt for you. the tool analyzes: - camera movements and angles - lighting and color grading - scene composition and timing then converts everything into sora-optimized prompt structure this is how you recreate any visual style without prompt engineering experience RT + reply 'TOOL' and i'll send you access (must follow so i can dm)
0:21

i built a tool that lets you clone ANY video with AI saw a movie scene you want to recreate? a commercial? a music video? just upload it to this tool and get the exact structured prompt to generate it in sora 2 you no longer need to guess how to describe what you want to generate. show the tool the reference and it engineers the prompt for you. the tool analyzes: - camera movements and angles - lighting and color grading - scene composition and timing then converts everything into sora-optimized prompt structure this is how you recreate any visual style without prompt engineering experience RT + reply 'TOOL' and i'll send you access (must follow so i can dm)

Miko

42,842 görüntüleme • 9 ay önce

💡8 new figma tips shared at #config23!!! How to add and organize your new variables, use auto layout wrap, set max/min width, and more!!.. 👇
0:34

💡8 new figma tips shared at #config23!!! How to add and organize your new variables, use auto layout wrap, set max/min width, and more!!.. 👇

Molly Hellmuth Tsacudakis

101,205 görüntüleme • 3 yıl önce