Instantly Improve your Designs with this Color Rule...

Easy color rule to follow for better ui designs | 60-30-10. Try Framer: framer.1stcollab.com/caleredw... and use promo code "FRAMER25INFLUENCER" to get 25% off first 3 months of Mini and Basic site subscription.
-
If you haven't downloaded Figma its Free:
psxid.figma.com/kh2feohwvmqd
Build websites with zero code, try Webflow:
webflow.grsm.io/caleredwards
Prototype your designs and test them with ProtoPie:
www.protopie.io/plans?ref=caler
Design & Develop faster with Relume:
library.relume.io/?via=caler
Products I use to make these videos and design every day with:
kit.co/caleredwards/my-setup
-
For Sponsorships & Collaborations contact me here:
www.caleredwards.com/sponsors...
For my design services contact me here:
www.caleredwards.com/creative...
-
Disclaimer: This video and description may contain affiliate links. By using any of my affiliate links, I receive a very small commission at no extra cost to you. Thank you for supporting the channel!
Music: Epidemic Sound
Instantly Improve your Designs with this Color Rule...
#color #colortheory #uidesign #figma #framer #webdesign #appdesign #uiux

[@UmairUlhaque]

Thanks, Caler for bringing the 60/30/10 color rule inspired by the interior design method. You have an exceptional visual eye for designing minimal modern interfaces as I have been following you for some years 🙂

[@CalerEdwards]

Thank you very much :D

[@designerdeepan4568]

Good one man . Nice video with proper explanation especially when you said they adopted this rule from interior design . Thats informative

[@CalerEdwards]

Glad you liked it :D

[@maskedvillainai]

keep in mind that contrast itself can propagate a higher percent value. So even if you have less white, it still adds higher *weight* to that element.

[@cipriantepes]

FINALLY a good video on 60-30-10 rule in web design.

[@CalerEdwards]

Thank you :D

[@bobolinnaing6051]

Very informative. Subscribed.

[@CalerEdwards]

Awesome, thank you!

[@suniljadhav1889]

great.....Thanx

[@CalerEdwards]

Most welcome!

[@user-dm3rv6cm1n]

Thanks for the useful video... Do you plan to post tutorials on Framer? Thank you!

[@CalerEdwards]

Yes, definitely

[@k2nnukas]

Tokenization video soon? :)

[@co0lxer]

ok, but what about separating sections on website? Use one of these colors, for example white section? Or use different shade?

[@maskedvillainai]

all you have to do with anything is duplicate all your colors in 2 groups: white & black. Increment each layer from 10% up to 60% or however many shades you want then overlap them. Then duplicate again > drag to the side > eyedrop each shade > add that as your official color variable. This way you can control the levels instantly.