How to Choose Colors (Easy 3-Step Process)

Sdílet
Vložit
  • čas přidán 15. 06. 2024
  • Learn to design high end websites with our Web Design Pro course - bit.ly/3WaPu9D
    Grab “The Complete Guide to Choosing Colors” for free here 👉 bit.ly/3IMy9iM
    Choosing colors for a new project is a daunting task for many (including myself).
    There's so much ambiguity involved:
    How do I decide on my primary color?
    How do I match it with other great colors?
    How do I apply all of my colors thoughtfully to my website?
    All of these questions are answered in this video through a simple & reliable 3-step process that you can apply to any project.
    Timestamps:
    00:00 Intro
    00:39 Choosing a dominant color
    2:00 Add two more colors
    4:12 How to apply your colors
    Check out our blog post on color (it includes a table explaining the meaning of every color): bit.ly/39fiw2R
    If you want to learn more about how to apply color to web design and combine that with great typography, layout, strategy and everything in-between, then check out our 10k Website Process course: bit.ly/39fiPe1
    -
    Learn how to build custom websites with Webflow FAST:
    bit.ly/WebflowWebclass2020
    -
    Find me on other social media platforms:
    Instagram: / ransegall
    Twitter: / ransegall
    LinkedIn: / ran-segal. .
    -
    Gear & Book Recommendations: bit.ly/2ohFOuj
    #choosingcolors #webdesign #graphicdesign
    Thanks for watching the video!

Komentáře • 444

  • @_aguskhaer
    @_aguskhaer Před 2 lety +669

    this 60/30/10 method is genuinely effective, now i got the key of reason why experts do a good decision colors

    • @alex.g7317
      @alex.g7317 Před rokem +1

      "why experts do a good decision colors"

    • @cactuz116
      @cactuz116 Před rokem +36

      @@alex.g7317 who cares. English isnt everybody’s first language

    • @Kensingtonhawk
      @Kensingtonhawk Před 4 měsíci +6

      ​@alex.g7317 Being fluent in english is not the flex you think it is. OP knows english cause it's one of the languages he speaks, whereas you know english cause it's the only language you know.
      Try having a common sense next time cause what OP said was easy to decipher.

  • @JohnUntivero
    @JohnUntivero Před 2 lety +330

    Anyone notice how he's using his colors (purple, peach, black) on his camera with the lights being purple, the skintones close to peach, and background/shirt being black with slight purple

    • @waleedreaper
      @waleedreaper Před 11 měsíci +4

      Yes, those are colors that are used to gain trust.

  • @edma369
    @edma369 Před 2 lety +9

    I just love your channel! Your videos are always so clear and concise, and straight to the point. You explain things so well, without being long winded (thank you!). I’m learning so much from you:-)

  • @middleburyastrology
    @middleburyastrology Před 2 lety +18

    Love this video :) Thanks so much for making this 60/30/10 clear. I've been designing graphics for years and am finally learning color theory. Thank you!

  • @lucidabi5524
    @lucidabi5524 Před 2 lety +5

    Waauw this is amazing! Love it how you simplified that! Me too, I find it challenging picking colours & letting them vibe! This 3-step process is amazing!! Thank you!

  • @riledmouse4677
    @riledmouse4677 Před 2 lety +210

    Wow, this video is one of the most helpful design tools I’ve ever come across. I’m not formally trained in design but I’m really interested in it and I need to understand it for my work. It’s been so hard to comprehend any of the written resources I’ve found. This just simplified things in such an accessible way, and gave me a place to get started from. I know it’s all pretty rudimentary but it feels like the missing link to help me actually begin to come up with a workable color scheme for my businesses. Thank you very much!

  • @languagelover3343
    @languagelover3343 Před rokem

    Thank you!!!! Love this video because it is focused on processes and steps which is so useful for rookies like me who only know the theory and don't even know where to start!

  • @tahiking-hazel603
    @tahiking-hazel603 Před 3 lety +3

    Great content Champ. Can't stop watching your Vids - keep it coming!!! all the way from New Zealand 🤙

  • @kylewoodard1900
    @kylewoodard1900 Před rokem

    Whoa - one of the best blends of pace, knowledge and practical application. Impressive video.

  • @russianrightnow
    @russianrightnow Před rokem

    Maaaaaan, I've finally found the video that completely answers my questions about color usage! Thank you so much for these tips. It will help me for sure 🌿

  • @helenchinweike8080
    @helenchinweike8080 Před 2 lety +3

    Thank you so much for this . You have saved a soul from difficult in selecting colours.

  • @MegaTeeArts
    @MegaTeeArts Před 3 lety +6

    Thank you so much. This is very informative and helpful, especially for a budding and self taught graphic designer like me. Many thanks.

  • @samer.mghabghab
    @samer.mghabghab Před 2 lety +5

    thanks for acknowladging the intelligence of the viewers and the customers in your videos, a lot of graphic designers need to see this

  • @meiyara.manawari
    @meiyara.manawari Před 3 lety +42

    thank you so much for these! as someone with logic-dominant brain, i suck at creativity. grateful to find your channel 💜

    • @adipurnomo5683
      @adipurnomo5683 Před 2 lety

      You left brain person, don't you? What do you do?

    • @patriciacoutinho4077
      @patriciacoutinho4077 Před 2 lety +13

      You don’t suck at creativity. You just probably don’t exercise it enough. Studying like you are right now will definitely help you! Good luck :)

  • @tomoworks5627
    @tomoworks5627 Před 2 lety +3

    I failed my capstone hi-fidelity mock ups just because of color. I cannot tell you how many sources I tried to figure out how to deal with color. This might have finally been the key for me to get past this door. Thank you so FREAKING much! 🏆

  • @remusb
    @remusb Před 3 lety +2

    That smooth zoom from the intro. Smoooth!

  • @SharonJohnsonFitness
    @SharonJohnsonFitness Před 2 lety +1

    Thank for for this video. I’m not great at picking colors either. This is so helpful for my work. Appreciate it!

  • @emilycolt9880
    @emilycolt9880 Před 2 lety +1

    Nice video! I like that even your filming setup uses all 3 of your colors, and that you're actually one of them!

  • @brycecox8249
    @brycecox8249 Před 3 lety

    Really appreciated the openness on the topic. Colour is hard at my current level of understanding

  • @daramolatoluwalope4660
    @daramolatoluwalope4660 Před 3 lety +51

    It took UI for me to start viewing Black and White as Colours I could actually plan with.
    In Arts school, it's viewed as neutral colours that you just use to mix other colours for the right tone or shade

    • @noskillzdad5504
      @noskillzdad5504 Před 2 lety +1

      well, in "science-world" they are not even colors... ;)

  • @adrianapascale3916
    @adrianapascale3916 Před 3 lety

    This channel is amazing, thank you for all this useful content!

  • @om.nom.candymadness1256
    @om.nom.candymadness1256 Před měsícem

    Amazing video! Thanks for clarifying colors! This was tremendously helpful!

  • @russelrealeza7142
    @russelrealeza7142 Před 2 lety +4

    Pretty helpful man, as a designer, color is my weakness. But your short video help me realized the importance of the 60 30 10 rule. Thank you so much for this man, and I'm looking forward to learn more from your upcoming videos

  • @GrgoPetrov
    @GrgoPetrov Před 2 lety +11

    Great tool. Choosing colours truly is a pain in the ass, especially when you have to take into account the print (cmyk, pantone) and the best compromise between the online and printed visual consistency. I am so happy when you just have to do the digital part. :-)

  • @chuckolator1859
    @chuckolator1859 Před 2 lety +32

    This is a super cool video! I'd love to see more about color usage. Specifically, what is implied by using contrasting colors, compared to similar colors? What is implied by a gradient? And what other techniques are there? I'd love to learn about that. I'm not sure what that's called though.

  • @thapryncess3
    @thapryncess3 Před 2 lety

    I’ve been searching and reading for hours and now I wish I came across this first!! Thank you!!

  • @imanealherchi4466
    @imanealherchi4466 Před 2 lety +1

    Great video thank you so much, I always waste a lot of time choosing colors and that made me so stressed, now I will stick to your strategy and the website you suggested is great.

  • @humility0is0a0virtue
    @humility0is0a0virtue Před 3 lety

    Man! You are always right on time! Thanks for sharing!

  • @gustavo15798
    @gustavo15798 Před 2 lety +3

    Thanks a lot for helping non-designer people. Straight to the point. I'm start a project, so it's probaly be needed.

  • @Kids_Toonz
    @Kids_Toonz Před rokem

    This is awesome, I’ve learnt a lot from this I honesty have great issues with my colors and fonts, thank you so much ❤

  • @sirsteadyeddie3478
    @sirsteadyeddie3478 Před 2 lety

    this is an amazing video ; im so glad i found this youtube channel. Phenomenal content 10/10

  • @roxcastaneda
    @roxcastaneda Před 2 lety

    This was very useful and short, I love short and clear and concise.

  • @_demonamv
    @_demonamv Před 2 lety

    Thanks Flux, it helped me a lot in choosing a color for my site, you explained pretty clearer than most of the videos on internet

  • @taofiqyakubu3036
    @taofiqyakubu3036 Před 2 lety

    i havent watched any of your tuts yet .. but from your studio lighting ... i just had to sub bro .. well done sir

  • @nsoneu
    @nsoneu Před rokem +1

    Love this! Accesibility colors, choosing fonts I would like to see more of this 👌👍

  • @kt1122
    @kt1122 Před rokem

    Thanks for the great video. Short and sweet, to the point.

  • @picmakerhq
    @picmakerhq Před 2 lety +62

    5:23 60/30/10 rule always works! It's awesome to watch you bring this up in the colors topic :)

  • @itsmissalina8888
    @itsmissalina8888 Před rokem

    This 7 minutes were so useful ! Thank you very much 💜💛🤍

  • @flix-tw5ow
    @flix-tw5ow Před 2 lety

    Awesome video, thanks so much for simplifying my life this much!

  • @CJBuzz-uk8hp
    @CJBuzz-uk8hp Před 2 lety

    I love all these rules. Although they're helpful for beginners and sophomoric designers. I think more experienced and capable designers get expand on this beginner palate.

  • @dianaavalos3033
    @dianaavalos3033 Před rokem

    This is really good information, clear and to the point!

  • @johnmartinpareja2500
    @johnmartinpareja2500 Před 3 lety +1

    Thank you so much for this tip!!! Very helpful

  • @faheemkausar669
    @faheemkausar669 Před 2 lety

    super useful. I recently has to plan for colors pallete ideas for a website revamp. This helped a lot!

  • @iziahw
    @iziahw Před rokem

    This is really helpful! Very valuable resources in this video. Thank you!

  • @benemarci1996
    @benemarci1996 Před 3 lety +1

    Thank you for the quality content! 🙏❤️

  • @thieutinhte
    @thieutinhte Před rokem

    I need videos like this to develop color thinking. thank you !!!

  • @VictorCapilla_ESP
    @VictorCapilla_ESP Před 10 měsíci

    So useful tips! Can't wait to use them on my projects 🔥

  • @Foxnet121
    @Foxnet121 Před 3 lety

    man i discovered your channel today, it is amazing!

  • @BrantK147
    @BrantK147 Před rokem

    omg I've been looking for something like this for ages. I can't believe this tool is not more known.

  • @ogundaretaiwo383
    @ogundaretaiwo383 Před 2 lety

    This is super useful to me. Sometimes, I create great designs by luck. Because I really have big issue with color combination. Thanks a lot. From Nigeria.

  • @sergiokiselov1458
    @sergiokiselov1458 Před 2 lety

    this 60/30/10 method is genuinely effective, now i got the key of reason why experts do a good decision colors
    Tnx ! great vudeo

  • @elpidampt9194
    @elpidampt9194 Před 2 lety

    This was very helpful!! Thank you very much!!

  • @toluwanimifavouronifade8702

    Really helpful tips, thanks Ran!

  • @mariannethompson8851
    @mariannethompson8851 Před 2 lety

    Thank u for this...easily understandable...easy to grasp...

  • @satah5045
    @satah5045 Před 2 lety

    Thanks for the links about colour 😊 it's really helpful

  • @promiseigbosonu1455
    @promiseigbosonu1455 Před 9 měsíci

    So helpful.. glad I came across it.. will be trying it out asap

  • @jennifermagpantay7933
    @jennifermagpantay7933 Před 2 lety

    Great video! Thanks for sharing! I have been using myColour for a long time and is defo a life saver tool!

  • @tieraneycarter5560
    @tieraneycarter5560 Před 3 lety

    This is super helpful! Thank you so much :).

  • @mouadhboukefa560
    @mouadhboukefa560 Před rokem

    You said a process and I saved the video immedietly. I am sure this is a great video even before i watch it. thank you for sharing

  • @Actidad
    @Actidad Před 2 lety

    Very well made video. Much appreciated!

  • @anonymousppl4528
    @anonymousppl4528 Před 3 lety +3

    I spent a few months trying to figure out a color palette for my website. Now I know what I must do. Thanks bro!

    • @chukaodunna5461
      @chukaodunna5461 Před 2 lety +1

      Lol, you sounded like Thanos 😂

    • @anonymousppl4528
      @anonymousppl4528 Před 2 lety

      @@chukaodunna5461 Hahaha ... yo, that's so funny I definitely sounds like Thanos at the end there. Good catch :)

  • @katinkaza
    @katinkaza Před 11 měsíci

    love this - thank you so much for this video !!!

  • @cilgin-oyuncu
    @cilgin-oyuncu Před rokem

    Thank you so much for helping me choose a color.
    Now I can decide on the colors of my company logo. :)

  • @alexbaciu8211
    @alexbaciu8211 Před 3 lety +14

    This is a very helpful starting point and works great for basic designs. However, I want to encourage everyone to not stop here with learning about palettes, because once you get into more than just simple brochure sites things start to change. In those cases starting with 3 colors like this is still your best bet, but you will most likely have to create shades for each of them. Add to that messaging colors (your reds for errors, greens for success, and so on) and things can easily start to get out of hand. On top of all that you will also have to manage the contrast between your colors so you can keep your UI's accessible.

    • @shinyshinythings
      @shinyshinythings Před rokem

      Thank you for bringing up the importance of accessibility!

  • @pipeliner8969
    @pipeliner8969 Před 2 lety

    this was really well explained! Thanks!

  • @aakashhhhhhhh
    @aakashhhhhhhh Před 2 lety

    This video is so helpful. I was stuck with color palette for our website

  • @AK-lj2pg
    @AK-lj2pg Před 3 lety +2

    Thanks for this video! I learned a lot from it. Choosing colors is for me a difficult part of designing and branding. :(
    That's why I always look for premade color palettes to help me. (And they work for me for 99% :P)
    That 60 / 30 / 10 rule sounds very interesting. Do you have or know any more indept video's or blogs? I'm very curious about it....
    Mostly because I'm the type of designer who gives my colors a function and uses the same color everytime again. So in one project every headers are the same color and the same for buttons.
    But hearing and seeing that I can work with it differently makes me very happy and curious to learn more about it.

  • @YamekDrope
    @YamekDrope Před 2 lety +1

    The most thing i hate about design is color plates especially when my clients have their color already. This video is very helpful i kinda understand what to do next time. Thanks

  • @ThomasGrantMacDonald
    @ThomasGrantMacDonald Před 9 měsíci

    Awesome! Using this right now for a Client website design. Thanks Ran

  • @adamstuartclark
    @adamstuartclark Před rokem +3

    I tend to use this approach but with two groupings ("main stage" and "supporting acts").
    "Main Stage" colours are brand inspired, while "Supporting Acts" are derived from a functional UI standpoint (error/success states, links, etc). It's important to know if these will clash.

  • @amalaliyu8905
    @amalaliyu8905 Před 2 lety

    Very helpful video I'm very thankful. Thank you 😊

  • @irinalinuza8341
    @irinalinuza8341 Před 2 lety

    Super helpful video, thank you a lot!

  • @ArtVandelayInc
    @ArtVandelayInc Před 2 lety

    Damn. I just signed in just to like this video. Such a great job at summarizing things. Well executed!

  • @kuroneko9493
    @kuroneko9493 Před 3 lety

    been very helpful, thank you. 😊

  • @happycloud8790
    @happycloud8790 Před 9 měsíci

    That's very helpful, thank you!

  • @jaychang100
    @jaychang100 Před 2 lety

    this help me out so much, thanks for the great content.

  • @bbtechie
    @bbtechie Před 2 lety

    Incredible! I love this. Thanks man

  • @kawserahmed1471
    @kawserahmed1471 Před 3 lety

    thank you man it's really helpful.

  • @KINGDOMPRENUERS
    @KINGDOMPRENUERS Před rokem

    Awesome explanation for the 60/30/10 rule. Great Video.

  • @hworknet
    @hworknet Před 3 lety

    Cool lesson. It will help me. Thanks. 😊

  • @MJallo
    @MJallo Před 8 měsíci

    Thank you so much. Very helpful tuto.

  • @nickdixon3536
    @nickdixon3536 Před 3 lety

    Good video, Keep em coming! 👍🏽👍🏽

  • @carlosnani
    @carlosnani Před 2 lety

    Thanks a lot. It'll gonna be very useful!

  • @dominiquevalle3519
    @dominiquevalle3519 Před 2 lety

    This was great!! Great link for colors pallettes

  • @prabhathsannasooriya
    @prabhathsannasooriya Před 3 lety

    i found this chanel today.there are lots of usefull things for frontend developer

  • @faithchijioke6752
    @faithchijioke6752 Před 2 lety

    This was really helpful. Thank you

  • @kofheartsdesigns
    @kofheartsdesigns Před 9 měsíci

    thank you for the concise tip!

  • @martamajkowska1046
    @martamajkowska1046 Před 3 lety

    Really useful video! Thanks 💙

  • @amarantakruger8902
    @amarantakruger8902 Před 2 lety

    Easy and effective thanks!

  • @kouroshazarian6089
    @kouroshazarian6089 Před rokem

    Awesome tools! Thank you, man. 🤩

  • @xyancpo
    @xyancpo Před 4 měsíci +1

    Thank you for the information, i always see people use this design recipe in their deisgn, and i wanna find how gladly i found the video!

  • @RenatoStupar
    @RenatoStupar Před rokem

    Thank you! Very nice explanation. Keep up good work. Cheers! :)

  • @camillabrandao_ads
    @camillabrandao_ads Před 2 lety

    Great video as always!

  • @mariab9702
    @mariab9702 Před 2 lety

    I am new to ux/ui design and I am loving this video! I wanted to know if you can you make a video a about color and ADA (accessibility) compliance.

  • @DavidStavegard
    @DavidStavegard Před 2 lety

    Hey, this was really interesting. I like that website that gave you the additional colors.

  • @jagrutisawant5205
    @jagrutisawant5205 Před 2 lety

    This is so helpful thank you .

  • @CoolIntellect
    @CoolIntellect Před 8 měsíci

    Thanks for this amazing one!

  • @Milchenkaa
    @Milchenkaa Před 3 lety

    Super helpful, thanks!

  • @7m0xd
    @7m0xd Před 2 lety

    This is really informative and helped me alot, I was just wondering is there a tutorial about how to pick a gradient color

  • @user-zh4vo1kw1z
    @user-zh4vo1kw1z Před rokem +2

    The thing to remember about colour meaning is that a lot of it is culture and context bound. McDonald's now using green in their logo is very different than a logging company. Bright blue used to indicate extreme wealth. In some regions white clothing is specifically related to mourning.