DEV Community

Cover image for Day 90/100 Color Theory
Rio Cantre
Rio Cantre

Posted on • Originally published at

Day 90/100 Color Theory

Every design must have a properly structured color system to be used on a project. Obtaining insight on a practical approach and putting more effort into bringing the ideal color system would eventually help select the suitable scheme.


Best Practices

  • Use neon colors sparingly.
    While the use of neon colors can feel hip, they are often hard on a user’s eyes.

  • Avoid vibrating colors. Vibrating colors result from
    pairing two colors with high saturation together that may be
    complementary to one another. It creates a glowing or moving effect, which also can be hard on one’s eyes.

  • Use backdrops to separate vibrating colors.
    In the example, the white backdrop behind the green card reduces the space where the contrasting colors (red and green) are directly next to each other, but the overall effect is still too intense for most websites.

  • Avoid color combinations with insufficient contrast, including:

    • Bright colors on top of bright colors
    • Light colors on top of light colors
    • Dark colors on top of dark colors
  • Even if there’s enough contrast in these pairings for the different colors to be legible, they likely won’t create enough contrast to attract the user’s attention.


I'm almost done with the challenge, making this daily made me think of doing something opposite. For instance, I read an article about "I completely ignored the front end development scene for 6 months. It was fine". I think I'll do fine if I finished this one.


Top comments (0)