Menu

55+ Best Color Tools & Articles for Designers

Colors are the very basic and important element of any design, you need to be really careful about creating colors for your designs. Today we are talking a little bit about colors in web design and we have collected some good tools and articles to help you master in creating color combinations. Those amazing tools gives you an understanding how to add correct and going colors for your designs, so let’s go to the list!

You may also like: Infographic Tutorial: Blue is Perfect Color for Web Design!


Articles

Learn the Basics of Color Theory to Know What Looks Good | Lifehacker

Learn-the-Basics-of-Color-Theory

Colors are important to making things look good, whether it’s the clothes you wear or the presentation you give at work. But not everyone instinctively knows that orange and blue is a perfect combination. If you can’t trust your own judgement, understand and rely on the basics of color theory to always pick the right colors.

Read More

Advent Color Stories | Frontify

Advent-Color-StoriesHere in Switzerland we love the Advent. What we love the most about it is the experience of all your senses. In this contemplative time before Christmas the scent of “Guezli & Glüewii” (cookies & mulled wine) is everywhere.

Read More

Creating Harmonious Color Schemes | Method & Craft

Creating-Harmonious-ColorInspired by the mixing of paint or ink, try this method of tinting your color schemes to craft a perfectly harmonious palette for your projects.

Read More

A Crash Course In Color Theory, Part Two: Color Harmony & Combinations | Dirigo

A-Crash-CourseColor theory is part biology, physics ( covered in Part One in this series), psychology (to be covered in Part Three) and geometry. I think one thing I love about playing with color harmony is how simultaneously mathematical and emotional it can be.

Read More

Infographic: The science of color | Script Tutorials

InfographicOur today’s collection of infographics is about Color. Color is an important component of every website. The final impression of your website depends on correctness of the chosen colors. And you don’t should neglect with it.

Read More

The Psychology of Color – Must See for Web Designers | Tech King

The-Psychology-of-Color-–-Must-See-for-Web-DesignersOne of the most fascinating and overlooked elements web designers tend to overlook is the influence of color on their website visitors. While a color palette may look visually pleasing, is it psychologically pleasing? When you go to design your next website pay special attention to your color choices and what they actually mean.

Read More

Selecting Your Own Color Scheme | Tuts+

Selecting-Your-Own-Color-SchemeBy now you should have a good idea of what color is, what each of the colors mean and have a good understanding of the different types of color scheme available to you. However, knowing all of that doesn’t help if you have no idea where to get started, or how to put that information into action.

Read More

Daily UX Crash Course: 13 of 31 | The Hipper Element

Daily-UX-Crash-CourseReal life is full of sun light, artificial light, heat, cold, clothing, brands, fashion, and a million other things that effect the way we perceive colours. As a UX designer we may not care about Pantones and brand guidelines, but we definitely have to learn about.

Read More

10 colour management terms designers need to know | Creative Bloq

10-colour-management-terms-designers-need-to-knowGetting your colours right means getting your head around some tricky terms. Our jargon-busting guide covers all you need to know. Checking the colours you see on screen are the same ones that are reproduced in your printed designs is fairly straightforward.

Read More

Color Theory 101 | SitePoint

Color-Theory-101First impressions are everything. How you look and how you present yourself can determine how you are perceived. The same goes for our design work. The impression that our work gives depends on a myriad of different factors.

Read More

Tools

Material UI Colors

Material-UI-ColorsGoogle’s material ui color palette comprises primary and accent colors that can be used for illustration or to develop your brand colors. They’ve been designed to work harmoniously with each other.

Source

Adobe Color CC

Adobe-Color-CCAdobe Color CC makes it easy to capture inspiring color combinations wherever you see them. Simply point the iPhone camera at something colorful and Adobe Color will instantly extract a series of colors.

Source

Coolors

CoolorsSuper fast color schemes generator for cool designers.

Source

BADA55.io

BADA55-ioBADA55.io is about finding the most badass leet words for your CSS hex colors.

Source

Genopal

Genopal Source


Paletton

PalettonThe Color Scheme Designer.

Source

Coleure

Coleure Source


ColRD – Color Creator

ColRD-Color-Creator Source


The Color App

The-Color-AppThe Color App makes finding colors much easier. Instead of a tiny circle with all colors running together, The Color App creates some separation between colors, making it easier to select the perfect color.

Source

Color Sphere

Color-Sphere Source


Color

Color Source


Contrast-A

Contrast-AThe application allows users to experiment with color combinations, examine them under the aspect of accessibility guidelines and to create custom color palettes.

Source

[ws] Color Scheme Generator 2

ws-Color-Scheme-Generator-2 Source


ColoRotate

ColoRotate1 Source


Colourcode

Colourcode1Pick colours based on hsl. Scheme-mode with monochromatic, analogic, complement, triad and quad colours.

Source


Color Palette Generator

Color-Palette-GeneratorMake color schemes. Enter the URL of an image to get a color palette that matches the image. This is useful for coming up with a website color scheme that matches a stock photo a client wants to work with.

Source


Color Palettes Color Schemes

Color-Palettes-Color-Schemes Source


ColorSchemer

ColorSchemerOnline Color Scheme Generator.

Source


Color Scheme Generator

Color-Scheme-Generator Source


CheckMyColours

CheckMyColoursIt is a tool for checking foreground and background color combinations of all DOM elements and determining if they provide sufficient contrast when viewed by someone having color deficits.

Source


Color Hunter

Color-Hunter Source


Multicolr Search Lab

Multicolr-Search-Lab Source


SpyColor

SpyColorSpyColor.com is a free service that provides information about any color, including conversions to many color models (RGB, CMYK, HSL, HSV, XYZ, xyY, CIELAB, CIELUV, CIELCH, Hunter Lab and YIQ). Schemes (harmonies), like complementary, split-complementary, triadic, tetradic, five-tone, clash, analogous and monochromatic colors can be found on each color page.

Source


Color Explorer

Color-ExplorerFree tools for working with digital colors.

Source


Hex Color Scheme Generator

Hex-Color-Scheme-GeneratorThis is a great tool to use if you want to develop a matching color scheme for your site. Say you want your nav color to be #000066 (navy blue) and you want to know what colors would go best with it.

Source


COPASO

COPASOCOPASO is an advanced color palette tool that helps you create the perfect color palette. If you’re finding COPASO a bit too rich for your color creating tastes, you can always use our basic color palette tool.

Source


ColourMod Dashboard Widget

ColourMod-Dashboard-WidgetColourMod originally made its debut as a web-based DHTML Dynamic Colour Picker. Since the inception of OS X from Apple, ColourMod has been ported to the Dashboard interface and is fully functional in OS X Tiger and Leopard, Lion and Mountain Lion.

Source


ColorZilla

ColorZillaEyedropper, Color Picker, Gradient Generator and more.

Source


ColorMunki

ColorMunkiColorMunki is the industry’s hottest all-in-one color solution that delivers unparalleled color control and color creation tools for photo and design digital workflows.

Source


colr.org

colr-orgPlay with colors and color schemes.

Source


ColourGrab

ColourGrabColourGrab is about er.. colours! Type a URL of any online image below and our system will tell you the most used colours from that image, and as a result give you some inspirtation! Not bad if you ask me! So without further-ado, let’s jump right into the meat of the program!

Source


GrayBit

GrayBit1GrayBit is an online accessibility testing tool designed to convert a full-color web page into a grayscale rendition to help visually test the page’s perceived contrast.

Source


Color Blender

Color-BlenderGrayBit is an online accessibility testing tool designed to convert a full-color web page into a grayscale rendition to help visually test the page’s perceived contrast.

Source


Stripe Generator

Stripe-Generator Source


Colors on the Web

Colors-on-the-WebWhether you are a blogger who needs ideas for a color scheme or a designer in search of some color inspiration, the tools presented here should give you a starting point. My hope is that this site will give web designers a better understanding of color theory and the importance of colors as it applies to web design.

Source


Pictaculous

PictaculousA Color Palette Generator (courtesy of MailChimp)

Source


Color Wizard

Color-WizardThe Color Wizard is a color matching application for anyone who wants to create designs with great looking colors.

Source


Colllor

Colllor1Color Palette Generator.

Source


Hex Color Code Chart & Generator

Hex-Color-Scheme-Generator

Hexidecimal codes are the 3 or 6-character codes that are often used in HTML and CSS to tell the browser what colors to display. So for example, #FFFFFF is the color white and #000000 is the color black.

Source


Color Scheme Generator

Color-Scheme-Generator1Color scheme generator: monochromatic, analogous, triadic, complementary, split complementary, tetradic schemes.

Source


Color Schemer

Color-SchemerColor scheme generator: monochromatic, analogous, triadic, complementary, split complementary, tetradic schemes.

Source


Color Hex

Color-HexColorHexa.com is a free color tool providing information about any color. Just type any color values (view full list here) in the search field and ColorHexa will offer a detailed description and automatically convert it to its equivalent value in Hexadecimal, Binary, RGB, CMYK, HSL, HSV, CIE-Lab, Hunter-Lab, CIE-Luv, CIE-LCH, XYZ and xyY.

Source


Hues – Les Teintes

Hues-Les-Teintes Source


Palette for Google Chrome

Palette-for-Google-ChromeGoogle Chrome extension that allows you to create a color palette from any image.

Source


Colorrrs

Colorrrs Source


Color Picking Tool

Color-Picking-ToolExplore Colors for HTML and CSS.

Source


colordb

colordb Source


BrandColors

BrandColors Source


0to255

0to2550to255 is a simple tool that helps web designers find variations of any color.

Source

Leave a Reply

Your email address will not be published. Required fields are marked *