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

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

Posted by admin
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. // \u2728 Helpful links: Realtime Colors: https://realtimecolors.com Figma Plugin: https://www.figma.com/community/plugin/1234060894101724457 Simplest JS Theme Switcher Code: https://codepen.io/Juxtopposed/pen/OJBxEXV HSL Color Difference Game: https://codepen.io/Juxtopposed/full/gOBWdaY // \u2728 Wanna make a site hassle-free, without coding? Use my colorful super-duper exclusive secret cheat code "pro-yearly-partner" to get 3 months for FREE on your Framer website here: https://bit.ly/41cAqKM * // \u2728 Let's connect: Twitter: https://twitter.com/juxtopposed CodePen: https://codepen.io/Juxtopposed Dribbble: https://dribbble.com/juxtopposed Github: https://github.com/juxtopposed 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. --------- * Yup, that's an affiliate link. you get 3 months free, I get a share at no extra cost to you. win-win! #colors #colordesign #colorpalette #RealtimeColors #uidesign #choosingcolors #webdesign ------- \u25ba Track Info: \u25ba Video Link : https://www.youtube.com/watch?v=nIrzhZNPaX8&t=0s Music provided by TikTak No Copyright Music.
Posted May 15, 2023
click to rate

Embed  |  220 views