View the original post
You know there are 10 million colors out there. That is enough to overwhelm any beginner designer. Okay, let’s be practical; we describe and use only 7 colors (VIBGYOR) in our daily life. But even using these colors can be very tricky if you’re a beginner, but you don't have to learn the color theory or the psychology of colors to use them correctly; luckily, there are some amazing tools out there that I rely on daily from my design projects to dribbble shots.
Here are the top color tools and plugins you need as a UI designer.
If you're building a design system, you might have to face the chaos of picking up the right color and shades of every color for the design system. Fortunately, there are tools like Material Design — Color Tool, which is good for making color systems, but if you want to step up the color game, Eva Design Color tool is all you need. The tool is equipped with deep learning and produces a stunningly accurate color system based on your primary color input. You can also see how the color will work in dark mode on the site, a cherry on top.
To start building something, you need inspiration as a starting point to get those creative juices flowing. Even from 7 colors out there, it’s sometimes too intimidating to pick up the right colors. Colorinspo is the tool to rescue you. As the name implies, this website has amazing colors to get inspired, and you can directly use them in your design, but it is not limited to solid color pallets; you can find some stunning gradients & Brand colors if you want to see what brand use exactly what color in their product or branding. Colorsinspo is the one resource to find everything about colors.
As a UI designer, when you create a digital product, it’s super important that every user will able to use can easily use it without any accessibility issue. Color accessibility enables people with visual impairments or color vision deficiencies to interact with digital experiences in the same way as their non-visually-impaired counterparts. While working with color, it’s common to pick up some colors that don’t pass all the accessibility tests, like the right contact ratio between foreground the background color, and W3C minimum AA rating. Color.review is a modern tool for exploring and finding accessible colors. The tool is super intuitive and easy as 123 to use. It makes it stand out from all the other tools that give you flexibility for using an AA or AAA rating for your digital product.
If somehow color.review wasn’t able to satisfy your color pallet hunger, and you’re still starving for delicious color palettes Mycolor.space is the place. Considering the tool is in beta now (date), it still cooks super delicious color palettes you can dump directly into your Figma or XD. I mostly use it for its gradient tool. You probably had gone through the situation when you got some awesome colors, and you want to check how their gradient looks or works, but launching a design tool to check this is a little overkill for the idea. Mycolor.space comes in handy in this kind of situation, and you can generate not only 2 but also 3 color gradients and choose any orientation, which is icing on the cake.
Talking of gradients, Gradient Hunt is the place I use for my gradients, but I also go there regularly to please my designer soul with all those beautifully curated gradients. From linear to radial, every color and gradient is artistic and unique.
If you want to step your color knowledge a little bit up and want to have a little deep knowledge about using them, then you might want to check the AdobeColor tool.
Adobe color wheel tool is packed with all the color harmony rules from Split complementary to Triad to Shades. The cherry on the cake also gives you the freedom to make a custom color pallet. I usually pick something like Triad from the options, then set it to custom to play with the colors until I find out what I want or have an Idea.
The thing is you can learn all the rules just by playing with adobe color and make some good looking pallets.
I hope these tools will help you in your next project, Thanks for reading.
Check my Medium for more.