I accidentally made the best way to choose colors for UI design - Realtime Colors v1

NEW - Watch the V3 updates: ------ Let’s see how we can choose colors for UI design using Realtime Colors, the first UI color picker that allows for visualizing your UI color choices on a real website. // ✨ Helpful links: Realtime Colors: Figma Plugin: Simplest JS Theme Switcher Code: HSL Color Difference Game: // ✨ Become a supporter: // ✨ Let’s connect: Twitter: CodePen: Dribbble: Github: Thanks for watching! -------- // Timestamps: 00:00 Intro 00:19 Color design is HARD 00:39 Introducing Realtime Colors 00:58 About Colors 01:12 Simplest UI Color Design Tutorial 01:25 Step 1: Test with Realtime Colors 01:59 Color Schemes 02:59 Step 2: Export the Colors 03:17 Step 3: Design with the Colors 03:38 Step 4: Code with the Colors 04:11 60-30-10 Rule 04:36 Color Psychology 04:57 The Takeaway -------- What is Realtime Colors? Basically, it’s a tool that allows you to pick your own colors for every element so you can have a better understanding of your color palettes and color design on different devices. - Skip spending several hours on implementing the colors in a design software, - Send the links of the colors to your friends, - Download the palettes in image and code, - Export the palettes on Figma through the plugin, - and many more features, like font picking, etc. :) In this video I’m also going through the implementation of the colors in both design (in Figma) and code, and explaining colors in UI design, including color schemes, the 60-30-10 rule, etc. --------- #colors #colordesign #colorpalette #RealtimeColors #uidesign #choosingcolors #webdesign ------- ► Track Info: ► Video Link : Music provided by TikTak No Copyright Music.
Back to Top