How to Play Your UI Design with Color Palette
Good UI design can make your users feel at home and confident in the product you’ve built. By using color effectively, you can help provide clarity and structure in the UI.
Defining Color
Color is an essential part of any brand identity. Choose from a range of color palettes to match your company’s style, or if you want to explore color, grab the various color palettes curated by these sites — Coolors and Colorhunt. Also, don’t be afraid to produce until you get the color that suits you. Here is the color we got.
The 60–30–10 Rule
The idea is simple. When you choose a new color palette, 60% of the palette is dedicated to the dominant color — usually, we call it neutral. Secondary color, or complementary, makes up 30% of the palette, and a third color, accent one, is used for the remaining 10% of the design. But the question is, how do you balance your color selection for your interface and how to implement it?
Vary the color palette above, using the same formula.
Implement
Once you have the desired formula, it’s time to implement the color into the design. We take the design example below to polish it better.
Tada!!!
Congratulation on your first step toward designing a unique web page. But we can do better! Select a different color from the palette below and repeat this part until you’re happy with your design.
The correct combination between text and background color is incredibly important for the user experience. Keep your copy easy to read by placing high-contrast colors next to one another. Use the WCAG tool to check it out.
As a UI/UX designer, we have to keep in mind that not only should our user experience be great but also how they interact with the design itself. Therefore, design is always a very important marketing and branding element.
