What is 60-30-10 Rule?

What is 60-30-10 Rule?

The 60-30-10 rule is a handy guide for creating a balanced color scheme in your interface design. It suggests that 60% of your color palette should be devoted to a dominant color, often a neutral tone. The secondary color, or complementary hue, should make up 30% of the palette. Finally, the accent color, used sparingly, should comprise the remaining 10% of the design.

HERE IS A SHORT EXPLANATION HOW THIS RULE WORKS. PICTURE BY INIYAVANAPPU

Tips & Tricks

  1. Start with grayscale. Applying colors too early can be a time-waster. Concentrate on spacing and arranging elements first. Ensure your text is readable by contrasting it effectively with the background.
  2. Avoid using pure gray or black; adding some saturation makes it more natural, as pure grays are rare in real life.
  3. Utilize color generators to streamline the process of finding a balanced color palette. I’ve listed some popular options for you below.

Useful Tools

  • Coolors.co Colors generator
  • Kuler Color wheel from Adobe
  • Paletton is Similar to Kuler, but you are not limited to 5 tones
  • Designspiration Inspiration tool. You can pick up to 5 colors and search for images matching your query


Like Comment and Share if you found this helpful

Follow Tayyab Ali For More Valuable Resources

To view or add a comment, sign in

More articles by Tayyab Ali

  • How to become a UI UX designer in 2024?

    How to become a UI UX designer in 2024?

    UI/UX design has become very popular and is still growing as technology changes. In 2024, it’s expected to be just as…

    12 Comments

Insights from the community

Others also viewed

Explore topics