UI Design | How to choose colors and color palettes

[@DesignerUp]

📚Watch more lessons like this in our Product Design (UI/UX) Course - designerup.co/product-design-ui-ux-course

[@whitebear224]

I just love how calm and steady she is. This channel is way too underrated.

[@DesignerUp]

Appreciate that @Lancebear. 😊

[@johvc]

Wonderful to finally see someone connecting the theory behind colors with the practical aspect of applying them in your work. Well done!

[@DesignerUp]

Cheers! Thanks a lot

[@okupaonome1032]

i have been struggling with colors, watched alot of videos but this made it easy for me to understand. Thank you from a picky understanding brain

[@DesignerUp]

So happy to hear that. You’re welcome, from one picky brain to another 💜🤓

[@UmairUlhaque]

Thank you for making such a comprehensive presentation about using colors effectively in UI design. Please make a short presentation or may be a video tutorial on 60-30-10 rule of applying colors.

[@maxdude4567]

Awesome video. The "less is more" approach always surprises me with how well it works

[@DesignerUp]

MaxM that’s exactly it!

[@fluffymaverick]

Thank God I can finally sleep. Ended up watching this and be able to fully grasp how to choose a color and how color theory works in a nutshell

[@DesignerUp]

That’s wonderful to hear 😀Best of luck

[@artiphishle]

first and most important: Thank you! Very nice explained videos. Then (fun fact): as not only a software engineer but also as a hobby: audio engineer and game sound designer (more orchestral composition and foley for the latter) I've learnt: mixing colors is like mixing audio, so why the noise in the background ;) you really can adopt the knowhow about design to make it sound (pun intended) 🎉

[@damienabbott9805]

Hi Elizabeth - this video is so brilliant as you as you open up a multitude a possibilities in colour combinations through the use of just one colour. This in turn make designer products slick, minimalistic and aesthetically pleasing. Just the way they should be. Thank you for this amazing tip.

[@DesignerUp]

Thank you Damien! That was exactly my hope for the video, which you so articulately stated 😀 thanks, as always for your support. Hope you are keeping well

[@prathikshasshetty9601]

Thanks for sharing this. You make learning fun and simple, thats truly an art.

[@DesignerUp]

That means a lot, thank you very much 😊

[@andigomez1993]

Great Video, i really like how you broke down how to pick our colors if choosing a monochromatic approach.

[@DesignerUp]

Thank you Andi! I'm happy that you found it useful.

[@KwekuTech]

Wow I now know how to select colors when it comes to design. This is really helpful

[@DesignerUp]

Really happy to hear that Kweku!

[@alexemma2826]

Wow! what a huge Level Up!

[@johnlin6121]

Thank you for this very doable tut! Excellent work.

[@DesignerUp]

Thanks John!

[@ashtonlandry]

Your speaking tone is brilliant 🙌💜 - great channel content as well! You’ve got a new subscriber 👍

[@DesignerUp]

So happy to hear that Ashton! 💜 Thank you! 😊

[@anmolsingh4026]

My quest for colors end today

[@lstx1977]

Really underrated! Great video!

[@DesignerUp]

Thanks!

[@nidarahman2305]

Wow that was a lot of very useful information in very short time

[@jeffbarnhart6441]

thank God yt delivered me to you. just what I was looking for for wp colors

[@DesignerUp]

Hahah so happy to hear that Jeff! It was meant to be!

[@abdou023]

I'd like a video showing where exactly are you selecting the colors on the color wheel instead of describing the process.

[@DesignerUp]

Thanks for your thoughts here! I do touch on that in this video @2:38 kzbin.info/www/bejne/raa9pqmee5mobLc but could definitely consider expanding more on that, however it's respective of the design software that you are using (ie. sometimes you'll be looking at a color spectrum vs a wheel).

[@MarkWhiteartist]

anybody feel like we should of paid for this? lol this was amazing!

[@DesignerUp]

Haha that really made me laugh and smile. Thanks for that Mark.

[@sarjeetthakur715]

I really didn't not get kind of information from my high reputed college❤️

[@emmyugwuoti6245]

Dont give them ideas

[@nested9301]

i like blue grey and white best combination for me

[@DesignerUp]

That’s a classic

[@gabrielmoraes4516]

Awesome! Thank you!

[@kinie43]

I love your videos so much. Have been struggling to understand colour theory for UI

[@DesignerUp]

Thank you Keneilwe. I sincerely hope they help you struggle a bit less! My best wishes 💜

[@lme918]

Thanks, too little views for such a gold live-saving material!

[@charleshaddock4426]

Damn, best video on color theory I've ever seen...and I've seen a lot of them. ty!

[@NurlanZhumakanov]

Wow! Thank you so much! You are also a good explainer )

[@balamsingh1356]

Thank you so much for this video...Just request to you...could you please make a video with an example with the help of coolors.co

[@FrameSorravit]

Really great video with clear information :)

[@DesignerUp]

Thanks Frame Sorravit ! Glad you thought so

[@suheiralattar5996]

thank you for your efforts , so useful videos and organised

[@suganyabasker4703]

Amazing, thanks very useful

[@AmolImpal]

Nicely explained. Want more...

[@DesignerUp]

More coming soon!

[@shreyjain3562]

Very informative video, I was looking for information something like this. Thank you for sharing the knowledge.

[@DesignerUp]

Thank you Shrey! I’m glad it helped. Appreciate you taking the time to comment!

[@Dima-ij2qi]

Thank you!

[@saumyarastogi2154]

Thank you:) u made it so easy to understand:)

[@DesignerUp]

Thank you! Glad it helped!

[@jituchauhan3431]

Amazing, also learn figma in my channel kzbin.info/door/RwYDakXkxcLfismc23aS_g

[@wonderfullife8416]

that's some quality content, tbh!

[@DesignerUp]

Thanks very much!

[@shamirk.a7172]

Helpful, thank you

[@carlosreyes6612]

Thank you, for this video,

[@sduka1909]

Very helpful!

[@MartinGarnett]

Hi, nice paced video. But I’m wondering, how do you handle errors, warnings, and success colours when designing with just one hue?

[@DesignerUp]

Thanks Martin. For this particular video I didn't go into color as applied to UX or usability hieristics for components states. This is really just focused on pairing hues for UI visual elements. In terms of errors, warning and success...there are some standard color guidelines that we normally follow (along with applying contrast standards). Red for error, yellow for warnings, orange for transient warnings, green for success/encouragement. These are generally universally understood to be good practice. Hope that helps!

[@kulrajchavda9538]

Best channel everrrrr

[@DesignerUp]

Haha thank you Kulraj!

[@sachinwalia264]

Wonderful video!

[@DesignerUp]

Thanks Sachin!

[@OlanrewajuOnakoya]

Wait that's not her voice behind the animated video 😳🤩🤩🤩🤩🤩🤩😍

[@DesignerUp]

It sure is 😊

[@michaelbarley]

Very good information! Thank you very much

[@DesignerUp]

Thank you Michael, I'm glad you found it useful.

[@nileshgosavi9527]

Very Good Video @Elizabeth Alli

[@DesignerUp]

Thank you @Nilesh

[@mouadhboukefa1546]

Great video. Thank you so much

[@DesignerUp]

Thank you Mouadh!

[@farshadamirshoghi9323]

thank you , good video

[@courtneym7552]

Here from springboard ⭐️

[@milindkhadse556]

It's very helpful

[@tanveersingh8717]

Awesome, so easy to learn and understand

[@elle8995]

Really happy to hear you think so! Appreciate your comment.

[@DesignerUp]

Glad to hear it @Tanveer thank you!

[@realavy3577]

One of the best video

[@DesignerUp]

That’s so nice to hear! Thank you 😊

[@NoahThul]

Awesome presentation!

[@elle8995]

Thanks @Noah! Hope it was helpful.

[@NoahThul]

@@elle8995 I've been in design for a good amount of time now and this was a great way start thinking more concisely about color selection. It was both affirming of previous knowledge as well as inspiring for future projects. I particularly liked the pallet presentation at 3:34 and the shade/saturation insights at 2:39.

[@DesignerUp]

This is such appreciated feedback @Noah Thul! Having taught color theory in different ways over the years I noticed my students found it most helpful when I related things back to the color picker (which is the main vehicle through which we and apply this information in our design process ). I'm glad to hear this resonated with you too and for you stopping by to say as much.

[@LIMELIGHT0]

❤ Lovely I very much appreciate

[@richarddyer3701]

Really good video thanks!

[@DesignerUp]

Thank you Richard! Glad it was helpful :)

[@chiotingkiat7548]

Fantastic video and visualization! Quick clarification, what did you mean by tinting your greys and blacks with your brand color?

[@DesignerUp]

Thank you Chio!! So instead of dragging your color picker all the way to solid gray or black. Start with your brand color and drag it into the back or gray (but keep it to where you can still see that brand color peaking through). For example, if your brand color is purple, your gray should be a purple-ish gray or if it’s green, a green-ish gray or whatever your main color is. Make sense? It should be subtle but by having a little hint/tint of that main color mixed in you get a really nice harmony between colors and something to ground your palette! 🎨

[@LinguistAna]

great video , thanks alot

[@DesignerUp]

Thank you Ana

[@shubhashisdas9399]

Its too good .amaziing

[@Mewsword]

thanks alot!

[@arthurpedro4510]

Love it!

[@DesignerUp]

Thanks Arthur!

[@heshamabuzaid4293]

thank you

[@CoryTheSimmons]

I really don't want to toot my own horn but I never studied this and just ended up figuring out _all_ of these exact same things. Not even kidding. Yes, I know this comment is cringe. I'm sorry. :( Excited to subscribe and see more! You really condensed color stuff down to the perfect essentials.

[@DesignerUp]

Not cringe at all! haha that's pretty much how I learned this all too!! Thanks Cory, means a lot that it makes sense to others the way it finally clicked for me. More to come!

[@yasirabbas6650]

Hello, at 2:57, what are the fonts used for heading 'Color Theory' and 'Revolves around the color wheel' text. Thanks in advance!!!

[@DesignerUp]

Hi @Yasir the font for all of the headings including 'Color Theory' is Futura PT in Bold and the subheadings including 'Revolves around the color wheel' are Futura PT in Book. Thanks for watching!

[@THEMILLMINDSET]

Amazing video

[@DesignerUp]

Thanks so much

[@brotherstechnical1140]

Play at 1.25x for better experience

[@DesignerUp]

Ha yeah, I was weirdly slow in the beginning :/

[@woahbruh1897]

nice one g

[@karthikletskode8721]

what's the font used for `Color Theory` & `Revolves around color wheel`?

[@DesignerUp]

Hi there, the font is called Futura and is available on Googlefonts.

[@mahdibaha5127]

Awsome

[@khurramsiddique8889]

Thanks sister

[@DesignerUp]

Thanks man!

[@blackartify]

Video is perfect at 1.25x

[@DesignerUp]

Ha yeah, the sound is rough during the intro. It has been fixed in current videos (ashame I can't reupload this one) Thanks for watching anyway! Cheers.

[@georgejames3868]

Mute the audio on the introduction or almost anywhere at all, you would think she is on slow motion

[@DesignerUp]

So cringe, I know. I talk about this all the time. Hopefully you'll find subsequent videos far improved 😅

[@georgejames3868]

@@DesignerUp No cringe at all, and there isn't anything wrong with the way you talk, it was just something I noticed by mistake, your video is informative.

[@DesignerUp]

@@georgejames3868 Thanks George. I appreciate that.

[@davay1539]

Can I get you a better mic? =)

[@DesignerUp]

Well if you're offering... lol Cringe I know, but hey was my first video ever. I'd say the improvement now is apparent.

[@2002budokan]

Informative but the whole course costs 997$$$, I think they strongly believe that everyone in this planet earns dollars. 🤞

[@DesignerUp]

Hello, 2002budokan The education and preparation you receive from a high quality education correlates to your ability to earn a higher income. It is an investment in your future that enables you to make more money. We know how expensive this can be for some and have managed to make our course the most affordable program of its kind by far. We also offer generous discounts and other course packages to those that are in need. The value you receive from our program, as our students will tell you is well beyond the cost. Just to give you some perspective if you’ve ever looked into other similar programs: Our DesignerUp Course - $997 USD General assembly - $14950 USD Springboard- $9891 USD Career foundry - $6999 USD Designlab - $6749 USD We also offer endless free content and talks for those that are not able to invest this much in their career

[@2002budokan]

@@DesignerUp Udemy : 10$ per course. Skillshare: 99$ annual fee... Further, I am learning design not for job search, just because I want to learn it.

[@rectify2003]

Sorry, but the music is extremely annoying

[@shauntan5395]

Great video

[@DesignerUp]

Appreciate you Shaun!