Working with color can be tricky until you have a solid understanding of the basics. Luckily, there are plenty of free graphic design color resources available. Whether you are just starting out with color and need some free assistance or a color pro that wants to find some helpful sites, these free resources are great for any skill level!
UI Gradients is a great resource for creating web-safe gradients. The site lets you browse through striking gradients at random or filter them. Gradients can be filtered by color. Once you find a color you like, you have multiple options. You can download a JPG of the gradient, copy the css code, copy the hex code, or edit by rotating the gradient orientation.
Coolors is a color palette generator that gives you control over searching the palettes. Pressing the spacebar generates random graphic design color palettes, but you can lock any colors you want to keep. This gives you more control over what kind of palette you are looking for. The app costs $2.99, but the website version is free!
Colordot is a graphic design color swatch generator that lets you customize the color through different scroll motions. Scrolling around the swatch that fills the entire screen generates different colors. Moving side to side changes the hue, up and down changes the lightness, and scrolling changes the saturation. The current hex code is constantly displayed, but clicking will automatically copy the code. The app costs $0.99, but the website version is free!
Material Design’s Color Tool breaks down using graphic colors for the web. It lets you pick out primary and secondary colors, showing you how they should be implemented on your site. Under the accessibility tab, it explains how and where text is legible using your selected colors. Once you’re happy with the colors, there are multiple exporting options. The site lets you export the code to CodePen, another great web resource, from which you can copy or save the code.
These are just a few of the great graphic design color resources that are free to use.
[gravityform id="82" title="true" description="true"]