Loading video...

Video Failed to Load

There was a problem loading this video. This could be due to a temporary network issue or the video might be unavailable.

Created this lil color generator over the weekend. There are so many algorithms to choose from for generating beautiful color palettes. Also, You can get the output as CSS, JSON, or Tailwind tokens. Check it out with sound on :)

vijay verma

35,762 subscribers

182,325 views • 1 year ago •via X (Twitter)

Science & Technology Arts

Anya Rossi• Live Now

Private livecam show

12 Comments

vijay verma1 year ago

Check here figma plugin will come soon...

Mobile Scanner1 year ago

Scan any documents, convert images into text, PDF files, etc. 👍

vijay verma1 year ago

I wrote this color generator logic for my plugin But, I thought what about make small app for web and just create frontend so do the same :)

Anton Gridz1 year ago

Great work, Vijay! I’ll try using it in my next side project instead of the base Tailwind library. The sound really enhances the experience of interacting with the application.

vijay verma1 year ago

Thank you Anton 🙌

Johnny Logo 🏴󠁧󠁢󠁷󠁬󠁳󠁿🇬🇧🇨🇱🐺1 year ago

This is really amazing and useful, already can see me using this right now!

Gustav Ekerot1 year ago

Super useful and looks great! love the sliders and buttons, you even got the sounds effect 🤩

vijay verma1 year ago

Hey, Thank you Gustav. Just weekend fun project :)

Magnus Helander1 year ago

Great app, thank you! Learning about monochromatic colors, how they harmonize, it's hard. Came across Terminus, very skilled use of colors, thank you for sharing

vijay verma1 year ago

Thanks for the link. I’ll check this out

soham (open to work)1 year ago

I've been planning to build this for so damn long. thank you so much for actually doing it!

vijay verma1 year ago

Cheers 🙌

Related Videos

using this real-time UI colorpicking tool, now you can find random trendy color palettes on the design itself. just press the Spacebar and get started :) try it out now on @codepen: or check live site: #codepen #webdesign

using this real-time UI colorpicking tool, now you can find random trendy color palettes on the design itself. just press the Spacebar and get started :) try it out now on @codepen: or check live site: #codepen #webdesign

Juxtopposed

15,759 views • 3 years ago

UI/UX Designers, this might be one of the cleanest color palette generators I’ve seen lately. Kigen is a color generator that helps you quickly create beautiful palettes for your UI projects, making it easier to pick colors that actually work well together instead of guessing. Bookmark it for later 💜

UI/UX Designers, this might be one of the cleanest color palette generators I’ve seen lately. Kigen is a color generator that helps you quickly create beautiful palettes for your UI projects, making it easier to pick colors that actually work well together instead of guessing. Bookmark it for later 💜

Abraham John 🦄🦓

201,228 views • 5 months ago

Check your color contrast for accessibility natively in Figma—rolling out over the next week or so. Find it in a color picker near you!👏👏👏 • Auto adjusts for graphics / text size and weight • Visualizes out of range options • Click indicator to get accessible recommendation.

Check your color contrast for accessibility natively in Figma—rolling out over the next week or so. Find it in a color picker near you!👏👏👏 • Auto adjusts for graphics / text size and weight • Visualizes out of range options • Click indicator to get accessible recommendation.

miggi from figgi

34,709 views • 1 year ago

I work with shadcn/ui every day. I design with it, I build with it, and I see a lot of projects built with it. And honestly? Many of them look the same. Or worse - they look broken. Colors that clash. Fonts that don't pair. Dark modes that feel like an afterthought. The components themselves are great. The theming that people or AI make? Not so much. So I built a tool to fix that. I just launched my shadcn theme generator that will allow you to ship beautiful shadcn/ui themes in just 3-4 clicks. What it does: - Creates your entire color palette from 1 color (your hex or any tailwind color) - Works for light and dark theme - Only includes fonts that actually look good in UI - Font pairings I curated myself - Works for any project - landing page, dashboard, store - Has a color contast checker for the entire palette Too lazy? Just use random theme feature Done? Copy and paste the CSS to your global.css file or import to our Figma kit.

I work with shadcn/ui every day. I design with it, I build with it, and I see a lot of projects built with it. And honestly? Many of them look the same. Or worse - they look broken. Colors that clash. Fonts that don't pair. Dark modes that feel like an afterthought. The components themselves are great. The theming that people or AI make? Not so much. So I built a tool to fix that. I just launched my shadcn theme generator that will allow you to ship beautiful shadcn/ui themes in just 3-4 clicks. What it does: - Creates your entire color palette from 1 color (your hex or any tailwind color) - Works for light and dark theme - Only includes fonts that actually look good in UI - Font pairings I curated myself - Works for any project - landing page, dashboard, store - Has a color contast checker for the entire palette Too lazy? Just use random theme feature Done? Copy and paste the CSS to your global.css file or import to our Figma kit.

Matt

77,902 views • 6 months ago

A useful trick for making AI photos look 100% real: (it's not always the model — it can be the color grading) Out of the box, Nano Banana Pro can have a gray, flat look. Good composition, but these scream AI. Here's the system that fixes it: → Grab a reference photo from Pinterest with the exact aesthetic you want → Feed it to ChatGPT 5.2 with a prompt that extracts a detailed color grading JSON → Paste that JSON into image generator (Calico AI) → Generate your product photo. (the colors are now based on the reality you specify, not AI defaults) → Save that character as your reference for facial consistency across future shots From here you can build a full UGC model library. No creators. No shoots. Comment "IMAGE" if you want me to send you every prompt in this system (must be following so I can dm you!).

A useful trick for making AI photos look 100% real: (it's not always the model — it can be the color grading) Out of the box, Nano Banana Pro can have a gray, flat look. Good composition, but these scream AI. Here's the system that fixes it: → Grab a reference photo from Pinterest with the exact aesthetic you want → Feed it to ChatGPT 5.2 with a prompt that extracts a detailed color grading JSON → Paste that JSON into image generator (Calico AI) → Generate your product photo. (the colors are now based on the reality you specify, not AI defaults) → Save that character as your reference for facial consistency across future shots From here you can build a full UGC model library. No creators. No shoots. Comment "IMAGE" if you want me to send you every prompt in this system (must be following so I can dm you!).

David Roberts

21,075 views • 6 months ago

💖: Fit check, fit check~ (#loverrukk) Today i’m wearing the #YOONIGHTY “YOO RAGLAN LONG SLEEVE” in the #DarkBlue color. It’s so cute! You can style it with a skirt or pair it with pants too, it works with so many different looks. You can go for cool, cute, or even chic and edgy vibes. 💖: And there’s also a detail on the shirt that says “ and “Please do not visit our website because it doesn’t exist.”😹…but actually it does exist, y’all. You can shop on the website na ka~

💖: Fit check, fit check~ (#loverrukk) Today i’m wearing the #YOONIGHTY “YOO RAGLAN LONG SLEEVE” in the #DarkBlue color. It’s so cute! You can style it with a skirt or pair it with pants too, it works with so many different looks. You can go for cool, cute, or even chic and edgy vibes. 💖: And there’s also a detail on the shirt that says “ and “Please do not visit our website because it doesn’t exist.”😹…but actually it does exist, y’all. You can shop on the website na ka~

sᴀᴘᴘʜᴏʀɪᴀ 💫

12,781 views • 3 months ago

Future CSS Tip! ⚡️ You can combine CSS :has() & :user-valid/:user-invalid to power micro interactions 😍 No JavaScript. Watch for the little animations ✨ label { --color: var(--default); color: var(--color); border-color: var(--color); } .group:has(:user-valid) { --color: var(--valid); } .group:not(:focus-within):has(:user-invalid) { --color: var(--invalid); } These new pseudo-elements only fire once an input has been interacted with. This means you don't need to do things like the "transparent :placeholder-shown" hack from before 🙌 Then you can lean into the power of scoped custom properties and change the theme based on the status of a form group 😎 It's a nice little touch. But remember, don't rely on color to communicate things! CodePen.IO link below! 👇

Future CSS Tip! ⚡️ You can combine CSS :has() & :user-valid/:user-invalid to power micro interactions 😍 No JavaScript. Watch for the little animations ✨ label { --color: var(--default); color: var(--color); border-color: var(--color); } .group:has(:user-valid) { --color: var(--valid); } .group:not(:focus-within):has(:user-invalid) { --color: var(--invalid); } These new pseudo-elements only fire once an input has been interacted with. This means you don't need to do things like the "transparent :placeholder-shown" hack from before 🙌 Then you can lean into the power of scoped custom properties and change the theme based on the status of a form group 😎 It's a nice little touch. But remember, don't rely on color to communicate things! CodePen.IO link below! 👇

jhey ʕ•ᴥ•ʔ

284,005 views • 3 years ago

SAY THIS AS MUCH AS YOU NEED TO. BOOKMARK IT SO YOU CAN DO IT OVER & OVER & OVER. LET’S GET THIS SHOW ON THE ROAD. YOU ARE DIVINE. YOU ARE SOVEREIGN. AND THE WORLD NEEDS YOU SO IT CAN ASCEND TO FREEDOM. MUCH LOVE

SAY THIS AS MUCH AS YOU NEED TO. BOOKMARK IT SO YOU CAN DO IT OVER & OVER & OVER. LET’S GET THIS SHOW ON THE ROAD. YOU ARE DIVINE. YOU ARE SOVEREIGN. AND THE WORLD NEEDS YOU SO IT CAN ASCEND TO FREEDOM. MUCH LOVE

Lesgo Brando

30,370 views • 7 months ago

Add shadows to your drawing with Shading Assist in Clip Studio Paint! There are several presets to choose from so you can find the perfect shadows for any scene. Adjust them with the manipulator and use it as is or as a guide for your artwork!

Add shadows to your drawing with Shading Assist in Clip Studio Paint! There are several presets to choose from so you can find the perfect shadows for any scene. Adjust them with the manipulator and use it as is or as a guide for your artwork!

CLIP STUDIO PAINT

355,329 views • 11 months ago

Did you know you can grab any color name, RGB value, or hex code on your screen with your Stream Deck? 🎨 Using the Color Picker plugin, just hover your mouse over a color, press the key, and then paste the value anywhere. Here's how easy it is to set up:

Did you know you can grab any color name, RGB value, or hex code on your screen with your Stream Deck? 🎨 Using the Color Picker plugin, just hover your mouse over a color, press the key, and then paste the value anywhere. Here's how easy it is to set up:

Elgato

29,821 views • 1 month ago

YooYeon: " As soon as I go home today, I’m going to shut the doors and hide... so you guys are the only ones who get to see this hair color, other than the people at my agency." "That’s how important you all are to me. So, what do you think?" "But honestly, you know, this isn't the final color yet. So please don’t say things like, 'Oh, it’s way too yellow!'" "Please look upon me kindly. Thank you! Thank you so much for coming to today's concert." "Oh, and also... please say a word of encouragement to my hair, which is about to take on a brand-new color!"

감튀🍟

27,904 views • 4 months ago

Eric Rohmer on the use of Colour in "La Collectionneuse" (1967) and "Claire's Knee" (1970): "I didn't use color as a dramatic element, as some filmmakers have done. For me it's something inherent in the film as a whole. I think that in 'La Collectionneuse' (1967) color above all heightens the sense of reality and increases the immediacy of the settings. In this film color acts in an indirect way; it's not direct and there aren't any color effects, as there are for example in Bergman's most recent film, his second one in color, where the color is very deliberately worked out and he gets his effects mainly by the way he uses red. I've never tried for dramatic effects of this kind, but. for example, the sense of time-evening, morning, and so on-can be rendered in a much more precise way through color. Color can also give a stronger sense of warmth, of heat, for when the film is in black-and-white you get less of a feeling of the different moments of the day, and there is less of what you might call a tactile impression about it. In 'Claire's Knee' (1970), I think it works in the same way: the presence of the lake and the mountains is stronger in color than in black-and-white. It's a film I couldn't imagine in black-and-white. The color green seems to me essential in that film, I couldn't imagine it without the green in it. And the blue too-the cold color as a whole. This film mould have no value for me in black-and-white. It's a very difficult thing to explain. It's more a feeling I have that can't be reasoned out logically." (Eric Rohmer's interview with Graham Petrie, Film Quarterly, 1971)

Eric Rohmer on the use of Colour in "La Collectionneuse" (1967) and "Claire's Knee" (1970): "I didn't use color as a dramatic element, as some filmmakers have done. For me it's something inherent in the film as a whole. I think that in 'La Collectionneuse' (1967) color above all heightens the sense of reality and increases the immediacy of the settings. In this film color acts in an indirect way; it's not direct and there aren't any color effects, as there are for example in Bergman's most recent film, his second one in color, where the color is very deliberately worked out and he gets his effects mainly by the way he uses red. I've never tried for dramatic effects of this kind, but. for example, the sense of time-evening, morning, and so on-can be rendered in a much more precise way through color. Color can also give a stronger sense of warmth, of heat, for when the film is in black-and-white you get less of a feeling of the different moments of the day, and there is less of what you might call a tactile impression about it. In 'Claire's Knee' (1970), I think it works in the same way: the presence of the lake and the mountains is stronger in color than in black-and-white. It's a film I couldn't imagine in black-and-white. The color green seems to me essential in that film, I couldn't imagine it without the green in it. And the blue too-the cold color as a whole. This film mould have no value for me in black-and-white. It's a very difficult thing to explain. It's more a feeling I have that can't be reasoned out logically." (Eric Rohmer's interview with Graham Petrie, Film Quarterly, 1971)

DepressedBergman

61,555 views • 1 year ago

Introducing Color Dash Universe! A whole other universe has taken over the Color Dash island, Hop in now and check out what the new universe has to offer! Race against time and competitors to reach the right color before it drops away, Can you be the last man alive? Take on the challenge NOW! 0674-2650-3962 🎥-Moisty Media™

Introducing Color Dash Universe! A whole other universe has taken over the Color Dash island, Hop in now and check out what the new universe has to offer! Race against time and competitors to reach the right color before it drops away, Can you be the last man alive? Take on the challenge NOW! 0674-2650-3962 🎥-Moisty Media™

MrMonkeyFN

123,362 views • 2 years ago

Check this out!!! It’s a matte white R1S with projectors strategically placed around the car, all of which are precisely calibrated to change the entire SUV color! Sorry for the bad video as I was filming and changing the color at the same time. 🤣

Check this out!!! It’s a matte white R1S with projectors strategically placed around the car, all of which are precisely calibrated to change the entire SUV color! Sorry for the bad video as I was filming and changing the color at the same time. 🤣

Carlos R

16,325 views • 8 months ago

I decided to post the black hole shader for free, it's not something super special to keep for myself. You can get it from For depth occlusion to properly work in VRChat you must also add a directional light (with hard shadows, color can be black).

I decided to post the black hole shader for free, it's not something super special to keep for myself. You can get it from For depth occlusion to properly work in VRChat you must also add a directional light (with hard shadows, color can be black).

Mykhailo Moroz

28,406 views • 1 year ago

This indie developer is making a retro rogue-lite deckbuilder where you can choose to use your cards in both attack and defense modes! also check out the rad CGA color palette. It's called Keepers Of Vyrellia, any interest?

This indie developer is making a retro rogue-lite deckbuilder where you can choose to use your cards in both attack and defense modes! also check out the rad CGA color palette. It's called Keepers Of Vyrellia, any interest?

Best Indie Games

15,766 views • 3 months ago

While contrast-color() only returns black or white, there are workarounds! If you register a new custom property, you can use style queries for full color palette customization (but make sure to test the contrast yourself!) Another technique is using the contrast-color() value inside of color-mix() to provide a tint variant. This demo shows method 1 where you can get warmer light colors and blue-tinted darks instead of pure black and white. Cons: Firefox doesn't support style queries yet so browser support is limited for now (though it is an Interop 2026 feature!).

While contrast-color() only returns black or white, there are workarounds! If you register a new custom property, you can use style queries for full color palette customization (but make sure to test the contrast yourself!) Another technique is using the contrast-color() value inside of color-mix() to provide a tint variant. This demo shows method 1 where you can get warmer light colors and blue-tinted darks instead of pure black and white. Cons: Firefox doesn't support style queries yet so browser support is limited for now (though it is an Interop 2026 feature!).

Una 🇺🇦

12,244 views • 5 months ago

This Barbie is an artist—and so are you! 🎨 With Barbie Color Creations, kids (or you, TBH) can bring Barbie and Friends to life, just as you envision them. 📲:

This Barbie is an artist—and so are you! 🎨 With Barbie Color Creations, kids (or you, TBH) can bring Barbie and Friends to life, just as you envision them. 📲:

App Store

83,134 views • 3 years ago