I've been waiting, search for so much resources to learn how to define colors. Most of them were vague. This is it, feels like I found the right one. Big fan of your works Adrian. Lots of love.
Wow honestly this is so valuable for one video I have been confused about ways to create a good color palette but thanks to you and this video I am not again. Thank you so much
🎯 Key Takeaways for quick navigation: 00:00 🎨 Creating a well-balanced color palette enhances user experience and establishes brand identity. 00:27 🖌️ Different methods to create color systems based on project size, scope, and complexity. 01:07 🎨 Creating a basic color palette with primary, secondary, neutral, black, and white colors. 02:17 🎨 Organizing color shades and tints for flexibility and design variations. 06:13 🔗 Creating global color styles in Figma for efficient design consistency. 07:50 📝 Documenting color tokens and palettes for handoff and developer communication. 11:20 🌐 Automating color palette generation using Figma plugins for efficiency. 12:53 🛠️ Utilizing Material Theme Builder for automated color system creation. 14:11 🔄 Editing and updating color styles in Figma to maintain design consistency. 15:06 📚 Additional resources and design products for learning and enhancing skills. Made with HARPA AI
Such an Informative Video, search numerous videos on Colors found very usefull. Your video clear all of my doubts. I would also like to see the video on style guide as a follow up.
It will be great to include two or three fonts and show how to make font styles with them in projects when you need different font families. Maybe you can use the tailwind scale and token exports? 🙂
Hi Adrian, Great video to begin with color systems! One thing bugs me a little bit. Basically, my primary color's saturation begins with the value of 80 so when I create color system based on your tutorial, it allows me to change the saturation level only for the next two colors. Is there any rule of thumb which says that a color saturation can not be the same as the previous one? Should I simply decrease the S/L value from 10 to 5 for instance? This is my RGB: #C51617
My dude, now I know why my Android phone only offers me only those ugly-ass pastel toned color schemes... I'll keep my distance from Material Design 3 color system, for sure, god damn I used to have a great dark themed UI with a vibrant orange as accent, I miss that a lot as it's my favorite overall scheme. Now I have this dark theme with this lame-ass baby blue barely bright enough, as the orange tends more to a brown. What a pity
I've been waiting, search for so much resources to learn how to define colors. Most of them were vague. This is it, feels like I found the right one. Big fan of your works Adrian. Lots of love.
Glad I could help Siva! Thanks 😊
Thank you adrin for joining on RUclips and share your knowledge 😊
Having a lot of fun for sure! 😊
Wow honestly this is so valuable for one video
I have been confused about ways to create a good color palette but thanks to you and this video I am not again. Thank you so much
the greatest colors tuts I found Adrian, thnaks for great content ;)
Simple and educative 💯
Thanks a lot! Glad you liked it 🤝
Another super useful tutorial ! Thank you so much, keep going ! 🤩🙏
Thanks a lot! I’ll start posting more very soon 😁🙌
Wiiiiiiiii thanks! I needed this!! 😄❤
Glad I could help Rahul! 👋
Thanks for this walkthrough! It's helpful to understand these approaches for generating tints and shades in Figma.
Great work Adrian, I was looking for how to make an effective color system and you covered most of it.
All your contents are valueable
🎯 Key Takeaways for quick navigation:
00:00 🎨 Creating a well-balanced color palette enhances user experience and establishes brand identity.
00:27 🖌️ Different methods to create color systems based on project size, scope, and complexity.
01:07 🎨 Creating a basic color palette with primary, secondary, neutral, black, and white colors.
02:17 🎨 Organizing color shades and tints for flexibility and design variations.
06:13 🔗 Creating global color styles in Figma for efficient design consistency.
07:50 📝 Documenting color tokens and palettes for handoff and developer communication.
11:20 🌐 Automating color palette generation using Figma plugins for efficiency.
12:53 🛠️ Utilizing Material Theme Builder for automated color system creation.
14:11 🔄 Editing and updating color styles in Figma to maintain design consistency.
15:06 📚 Additional resources and design products for learning and enhancing skills.
Made with HARPA AI
Such an Informative Video, search numerous videos on Colors found very usefull. Your video clear all of my doubts. I would also like to see the video on style guide as a follow up.
Just wow its the perfect video about creating a color design thank you, sir
Thank you for this tutorial Adrian... Could you create a video on how to choose a typeface or pair two typefaces together in a design? Thanks a lot!
Yes, that’s a great idea! I’ll start planning a typography tutorial ✌️
It will be great to include two or three fonts and show how to make font styles with them in projects when you need different font families. Maybe you can use the tailwind scale and token exports? 🙂
Keep making this content bro, it really helps
Thanks for the simple sweet tutorial
My pleasure! :)
Thank you so much Adrian!!!
My pleasure brother! 🙌
Brilliant! Thank you for sharing
Excellent. How clear things are when someone explains them properly.
Amazing!Thank you
Adrian, you rocks man!!
Um tutorial muito bom!!! Foi passado mais de uma solução para a criação de paletas e bem explicadas, muito bom!
Excellent. I'm following you..🧡
Thanks a lot mate!
No worries! 😁
Typography next! And naming files with handoff in mind. Thanks
Cool...👍🏻 I'm more interested what primary color stands for in design. I usualy use accent color as accent, buttons, some text, icons... 🤔
Thank GOD for plugin automations 😩 😩 😩 Watching you manually create the 1st color palette system made my soul hurt 😅
Great! Thanks!
This tutorial is really helpful Adrian 😀Also please make tutorial on full website landing page prototype
For sure, there are a ton of prototype tutorials lined up for the next few weeks :)
Great 😃
Positive: Great content!
Not positive: Sound only comes from left side in this video.
Thank you for sharing
Adrian is amazing!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
Good evening Adrain. What is the plugging you used for the Auto method? 🙏🏻
Genius teachings
Hmm, eye-opening, that thing with the gray picking tint from the primary's main...
Can you elaborate how to choose a primary color?
Yes please create a style guide video 😅
Nice!
Thanks bro
Brother can you make video for spacing
For sure! I will think of one for the next week
Thank you soo much sir for sharing with us
Of course! Happy to share 😊✌️
Hi Adrian,
Great video to begin with color systems! One thing bugs me a little bit. Basically, my primary color's saturation begins with the value of 80 so when I create color system based on your tutorial, it allows me to change the saturation level only for the next two colors. Is there any rule of thumb which says that a color saturation can not be the same as the previous one? Should I simply decrease the S/L value from 10 to 5 for instance?
This is my RGB: #C51617
Do you have Full course in Udemy?
Anyone know the font used on the first design?
Hi❤, where's the follow up video..!!?
The video is good but the audio is only played on my left ear.
Don't waste time. Skip to 00:31
My dude, now I know why my Android phone only offers me only those ugly-ass pastel toned color schemes... I'll keep my distance from Material Design 3 color system, for sure, god damn
I used to have a great dark themed UI with a vibrant orange as accent, I miss that a lot as it's my favorite overall scheme. Now I have this dark theme with this lame-ass baby blue barely bright enough, as the orange tends more to a brown. What a pity