Cool color combination cheat sheet. Color wheel Color selection

04.03.2020

Color matching is one of the most important steps in the process of creating a good design.

To make it easier for you, we decided to compile a selection of the best services for creating color schemes. They will help save time, and at the same time get a decent result.

01. Adobe Color CC

Adobe has renamed its Kuler project to Color

You may be familiar with this tool by its former name, Adobe Kuler. However, Adobe recently renamed one of its popular web applications Adobe Color CC.

It allows you to select, create and save different color schemes, each of which can contain up to five colors. The tool is available in both browser and desktop versions. If you're using the desktop version, then you'll be able to export the color scheme directly to Photoshop, Illustrator, and InDesign.

02. Mudcube Color Sphere

If you're unsure about your color scheme, then Mudcude has its own gallery of pre-made assets.

Mudcube Color Sphere is a very handy miniature resource for designers that not only offers hex codes for selected colors, but also allows you to create color schemes for your own projects. It is also worth noting that Mudcube has its own gallery of ready-made resources that you can also use.

03. Check my Colors

Check my Colors is designed specifically to evaluate and match the background and foreground color combination for all DOM elements. And also in order to find out whether the elements are harmonious enough with each other. All tests are based on algorithms recommended by the World Wide Web Consortium ( W3C).

04. The Color App

The application will help you find out the RGB, HEX, and HSLA values of the selected colors

iOS tool The Color App allows you to easily and simply define colors using a large color palette. It allows you to find out the RGB , HEX and HSLA values of colors, as well as create your own color schemes for the site.

05. Color Hunter

Color Hunter generates a color scheme based on the selected image

This is a very handy tool, especially if you need to find a specific color. Select an image and upload it to Color Hunter. The tool will create a color palette based on the selected image. This is a great method for creating your own color schemes.

06. Tin Eye

If you need to get a specific color, just enter the HEX value in the URL

This site uses a database of 10 million images available for free under a Creative Commons license agreement, carefully selected by the creators from Flickr. They can be used to generate appropriate color schemes.

07 Color

Convenient miniature web application. Hover your mouse over the screen and determine desired color, then scroll a bit to match the hue. After that, the tool will give out all the necessary HEX codes that you can use in your own projects. One of the easiest tools to use.

08 SpyColor.com

A free color scheme generator that provides color information and also allows you to convert it to any scheme ( RGB, CMYK other ). A variety of color scheme formats are available here, including triadic, monochrome, and more.

09.Design inspiration

Up to five shades can be selected on Designspiration with a handy full-page palette that makes it easy to find exactly the HTML color schemes you're looking for. The site will then generate a page with all the images in the database that use a similar color combination. It will also provide HEX values that you can use in your own projects. And images can be saved in collections on the site.

10ColorExplorer

One of the most thoughtful web tools that offers a lot of features related to color scheme design, customization and analytics. Here are some tools to help you determine WCAG validity of color schemes, as well as generate your own color palettes.

11. Hex Color Scheme Generator

A handy little tool for generating color combinations based on a single selected hue. Paste in the hex value of the color and the tool will provide a set suitable colors, which can be used along with the main one.

12. COLOURlovers

COLOURlovers is a community for sharing color schemes. Here you can draw inspiration from the color sets of other users, as well as create and share your own.

13. Color Scheme Designer

This online tool offers interesting ways to generate color schemes, allowing you to adjust their brightness and contrast. Here you can create some popular mathematical models color schemes, including monochrome.

14. COPASO

One of the tools from the COLOURlovers website. But COPASO deserves special attention, as it is an incredible all-in-one solution, and makes it easy to generate ready-made color schemes for the site. There are many tools for color matching, and all of them are placed in a convenient and simple interface. In addition, notes can be added to palettes, images can be uploaded, and so on.

15. Colormod

Colourmod represents software, which allows you to select individual colors from the widget area, whether you're using a Mac or Konfabulator on Windows. It's not exactly a simple tool for working with color palettes, but it will help you quickly and easily determine colors without having to download heavy programs.

16. ColorZilla

ColorZilla is available for both Chrome and Firefox

This project started out as a plugin for Firefox , but today it is also available for Google Chrome . ColorZilla is an extension that includes several tools for working with color, including a palette, a css gradient generator, and an eyedropper.

17. Colormunki

A handy online tool for selecting color schemes from the creators of Colormunki. With it, you can easily create attractive color palettes from Pantone-based samples using several techniques.

18.colr.org

Colr.org allows you to set the color range of any image

This tool allows you to detailed analysis image colors, which is usually automated in other tools. This will allow you to choose the most suitable color. We recommend getting to know this tool, although its interface is not as well thought out as in other applications.

19. Color Grab

This handy tool creates color palettes from any image. Paste in the address of the image you want to analyze and the service will automatically generate a 3D graph with information on the colors used. Although this application is not exactly suitable for selecting a color scheme for a site, it can be used to study images and their color characteristics.

20 Color Blender

ColorBlender generates a palette of five matching colors

One of the simplest tools that allows you to adjust the color and get five matching colors in real time. The generated palette can be downloaded in Photoshop or Illustrator as an EPS file.

21. Gray Bit

GrayBit lets you analyze websites to see how they would look in grayscale

This tool will help you see how your site looks in grayscale. An excellent service that will allow you to identify problem areas in contrast.

22. COLRD

A tool that can be used as inspiration or to share color schemes. Of course, this resource will not help with generating circuits, but it should definitely be taken into account.

23 Shutterstock Spectrum

Images can be filtered by color balance and brightness

Sometimes it's easiest to check if a color scheme will match by looking at stock images. Almost all major stock resources offer such tools, but Shutterstock Spectrum has a very user-friendly interface. After using the slider to define the color, you will be able to specify keywords, which will allow you to determine the theme of the pictures. In addition, you can filter images by color balance and brightness.

Guys, we put our soul into the site. Thanks for that
for discovering this beauty. Thanks for the inspiration and goosebumps.
Join us at Facebook and In contact with

Scheme No. 1. Complementary combination

Complementary, or additional, contrasting, are colors that are located on opposite sides of the Itten color wheel. Their combination looks very lively and energetic, especially with maximum color saturation.

Scheme number 2. Triad - a combination of 3 colors

The combination of 3 colors lying at the same distance from each other. Provides high contrast while maintaining harmony. Such a composition looks quite lively even when using pale and desaturated colors.

Scheme No. 3. A similar combination

A combination of 2 to 5 colors located next to each other on the color wheel (ideally 2-3 colors). Impression: calm, relaxing. An example of a combination of similar muted colors: yellow-orange, yellow, yellow-green, green, blue-green.

Scheme No. 4. Separate-complementary combination

A variant of a complementary combination of colors, only instead of the opposite color, the colors adjacent to it are used. The combination of the main color and two additional. This scheme looks almost as contrasting, but not so tense. If you are not sure that you can use complementary combinations correctly, use separate-complementary ones.

Scheme number 5. Tetrad - a combination of 4 colors

A color scheme where one color is the main one, two are complementary, and another highlights the accents. Example: blue-green, blue-violet, red-orange, yellow-orange.

Scheme number 6. Square

Combinations of individual colors

White: goes with everything. The best combination with blue, red and black.
Beige: with blue, brown, emerald, black, red, white.
Gray: with fuchsia, red, purple, pink, blue.
Pink: with brown, white, mint green, olive, gray, turquoise, baby blue.
Fuchsia (dark pink): with gray, tan, lime, mint green, brown.
Red: with yellow, white, brown, green, blue and black.
Tomato red: blue, mint green, sandy, creamy white, gray.
Cherry red: azure, gray, light orange, sandy, pale yellow, beige.
Raspberry red: white, black, damask rose.
Brown: bright blue, cream, pink, fawn, green, beige.
Light brown: pale yellow, creamy white, blue, green, purple, red.
Dark brown: lemon yellow, sky blue, mint green, purplish pink, lime.
Reddish brown: pink, dark brown, blue, green, purple.
Orange: blue, blue, purple, purple, white, black.
Light orange: gray, brown, olive.
Dark orange: pale yellow, olive, brown, cherry.
Yellow: blue, mauve, light blue, purple, grey, black.
Lemon yellow: cherry red, brown, blue, grey.
Pale yellow: fuchsia, gray, brown, shades of red, tan, blue, purple.
Golden yellow: gray, brown, azure, red, black.
Olive: orange, light brown, brown.
Green: golden brown, orange, lettuce, yellow, brown, grey, cream, black, creamy white.
Salad color: brown, tan, fawn, gray, dark blue, red, gray.
Turquoise: fuchsia, cherry red, yellow, brown, cream, dark purple.
Electrician is beautiful in combination with golden yellow, brown, light brown, gray or silver.
Blue: red, grey, brown, orange, pink, white, yellow.
Dark blue: light purple, sky blue, yellowish green, brown, gray, pale yellow, orange, green, red, white.
Lilac: orange, pink, dark purple, olive, grey, yellow, white.
Dark purple: golden brown, pale yellow, gray, turquoise, mint green, light orange.
Black is versatile, elegant, looks in all combinations, best with orange, pink, salad, white, red, lilac or yellow.

Professional web design is not complete without creating a color scheme. This article is about 20 fantastic tools to help you get the perfect color match.

There are many tools on the World Wide Web for achieving color nirvana. They seem to be completely different, but many of them are just modified versions of more popular and useful tools.

Therefore, to simplify the selection process color solution, we've rounded up the top 20 tools available. They will help you not to get lost in your search. suitable option and feel the "color bliss"

01. Kuler

Kuler is perhaps the most well-known color tool.

Adobe Kuler is arguably the most popular online color theme tool that has gone from a simple tool for working with color on the web to a full-fledged resource where you can create themes and share with others. Plugins are available for all major Adobe applications, including Photoshop, Illustrator, and InDesign, making Kuler a great multifunctional tool for regular Creative Suite users.

02. ColorExplorer

ColorExplorer can perform many different functions.

We can say that this is one of the most thoughtful tools that are on the Internet. It offers a large set of tools to design, customize and analyze your color palettes. For example, tools that help determine accessibility WCAG color picker, conversion tools that allow you to move between different systems, plus everything you need to select colors and create palettes.

03. Colors on the Web

Colors on the Web is powered by Flash.

Colors on the Web loads solid HEX or RGB colors and produces a set of schemes based on various mathematical proportions. This tool does not work on iPad or iPhone because it uses Flash to run the program.

04. COLOURlovers

COLOURlovers is a bit like Pinterest for color

05. Pictaculous

Pictaculous allows you to upload an image and generate a color scheme based on it.

This tool from the creators of MailChimp will allow you to upload an image and create a color scheme based on its own colors. It is compatible with some other instruments like Kuler and Colourlovers. Pictaculous has a handy Adobe Swatch to load with themes, making it quick and easy to "capture the colors" you need to complete your photo.

06. Contrast-A

Contrast-A creates an imitation of various visual defects.

This is not a typical color scheme tool. It's designed to make sure you've created a WCAG-compliant color scheme, this is done by previewing contrast levels, and using the technique of simulating lack of color perception and low visibility. Contrast-A has a lot of links to manuals that explain everything in a more user-friendly way than the specifications document itself.

07. ColoRotate

ColoRotate boasts a beautiful "color wheel" visualization

ColoRotate has similar features to Kuler, but differs by displaying the palette on a beautiful 3D cone and the ability to generate more than 5 colors in one scheme. The tool can be integrated with some Creative Suite applications. It's also available as an iPad app and can work with Photoshop in color console mode.

08. Hex Color Scheme Generator

HEX creates colors that work well with the existing color scheme.

HEX is a handy little tool for generating colors. Just enter a color code and it will display a set of nice colors that will pair perfectly with your base colors.

09. Color Scheme Designer

The Color Scheme Designer has some interesting ways to create color themes.

This online tool has similar features to Adobe Kuler. But thanks to interesting tricks for creating color themes, it allows you to select parameters for brightness / saturation and contrast from the properties of the scheme, instead of “tinkering” with the individual colors that make up the theme. Color Scheme Designer provides access to a set of standard mathematical methods, including the ability to harmonize the color scheme of a design for one (mono), two (complement), three (triad) or four (tetrad) colors with shades and semitones.

10. COPASO

COPASO is an excellent tool for solving several problems at once.

One of the website tools COLOURlovers, COPASO deserves special attention, as it allows you to simultaneously solve many issues when creating palettes. It provides a complete set of color selection tools in a simple interface. It lets you mark up palettes, upload images, jump directly to CMYK links, and choose how to create your color scheme.

11. Colormod

The Colourmod desktop widget helps you easily select and define colors.

Colourmod is a desktop tool that allows you to easily select one of the colors in the area where the widgets are located, even if you are working with Dashboard for MacBook or Konfabulator for Windows. Colourmod itself is not a palette selection tool, but it can still be used to select and define a color. In this case, you do not need to run other heavier programs.

12. ColorZilla

ColorZilla works in Chrome and Firefox.

This application was originally developed as a plugin for Firefox, but it can also be used in the Google Chrome browser. ColorZilla is an extension that has a ton of various tools to work with color, including: color picker, eyedropper, css gradient creation and palette browsing.

13. Colormunki

Colormunki allows you to create a color scheme based on Pantone swatches.

A handy online tool introduced by the creators of Colormunki for color calibration. You can create palettes based on Pantone color swatches online and use different tricks for nice combinations.

14.colr.org

With Colr.org you can see color scheme your images.

This simple tool provides a unique opportunity to analyze the color scheme of an image (in other programs this function is performed automatically). This way you can see what colors your picture consists of and choose the ones you like to set them as the main colors of the theme.

15. Color Grab

ColourGrab is a great compact image color scheme generator.

This handy tool creates a color palette based on any image on the web. Just enter the address of the image you want to analyze, the site will "grab" it, determine its color scheme and create a simple 3D diagram that will reflect the use different colors for this image. Let him be and not the most the best option for standard themes, but ColourGrab is great for analyzing color distribution in images.

16 Color Blender

ColorBlender creates a set of five colors that blend well together.

This site is a simple tool that allows you to create a sample image, adjust colors and follow in real time how a set of 5 perfectly matched colors is selected. The palettes can be downloaded directly into Photoshop or into Illustrator as an EPS file.

17. Gray Bit

GrayBit allows you to analyze a website to see how it looks in grayscale.

This handy tool doesn't directly match color themes, but it does allow you to analyze your site to see what it looks like when converted to grayscale. This will help you check if you have achieved enough contrast in the color palette to make it easy to read.

18. COLRD

COLRD is perfect for sharing your color schemes and learning about new ones.

This colorful site is a great source of inspiration, where users share their color palettes, as well as gradients and pictures. This isn't just a color scheme site, but rather a feast for the aesthetic sense, and it's well worth stopping by for a couple of amazing discoveries.

19. Color Hunter

Color Hunter is a great site to find new colors.

Color Hunter helps you quickly match the color scheme of uploaded images by searching for a suitable tag or using HEX links. Quick and easy to use, the site allows for interesting color discoveries.

20. Strip Generator 2.0

Stripe Generator 2.0 helps draw attention to your color schemes.

It is often referred to as "the latest tool for web 2.0". Stripe Generator 2.0 good remedy to create pleasing color combinations and unusual images at the same time.

Color is widely used in design - it allows you to "revive" the content - to create a semantic connection between elements, to fill the work with emotions and mood. Beginning designers pick random colors, but there are ways to use color more meaningfully. Consider 4 such methods, organized according to the principle from simple to complex.

1. Use a known gamut

There are over 500 color combinations on brandcolors.net famous brands. Yandex, Google, Burger King use the same palette in all their products. These brands and their colors are familiar and loved by many. Type the name in the search bar or scroll through the page, click on the desired brand and color: its code will be copied to the clipboard.

2. Choose a ready-made professional palette

The easiest way is to take a ready-made combination of colors. You don't have to reinvent the wheel every time harmonious combinations known for a long time. Go to colordrop.io and choose. There are hundreds of professional 4-color palettes on the site. After selecting the one you want, click and copy the color codes from the panel that opens on the right.

In addition, the service contains ready-made selection of 24 flat design colors. Click on the left under the name "Flat Colors" and take the code of the shade you like.

3. Determine the color palette of the photo or picture you like

This method is a little more difficult. But also more effective.

On the site coolors.co in the top panel on the left, find the camera icon, click on it. An image upload window will open.
You can choose a photo or picture with the color scheme you like from your computer or copy the link to an empty column.
The service will determine the combination of colors (below, under the uploaded picture).
You can change the individual colors of this palette by marking them and selecting a point in the photo from which you want to take the color.
The "Collage" button saves the resulting palette with color codes on the computer.
The "Auto" button generates new combinations based on the same photo.
Click "OK" and go to home page site for further work with palette.

The main page of the site is no less functional. Here you can pick up shades of individual colors or assemble a new palette by replacing individual colors.

4. Create your own color scheme online

By uploading a photo to the same site coolors.co, you can not only determine the color code, but also create your own combinations. To do this, press the spacebar - the service automatically creates a combination of 5 colors.

On every color 4 button icons:

Alternative shades - Shades of color (darker and lighter),
Drag (Move color to the right or left on the palette),
Adjust (Adjust hue, saturation, brightness, etc.),
Lock (fix color).

Choosing a color scheme for a site is one of the important points in the design process. Choosing a combination of colors is a rather complex and creative process. Fortunately, there are many services that can provide significant support for making the right choice.

Some of the resources mentioned in this overview provide a choice of a large number ready-made color schemes, while others allow you to interactively build own scheme.

Kuler

Adobe Kuler contains a large library of pre-made color schemes. You can view the diagram online and download it for use in the Adobe Creative Suite products.

Color Lovers currently has nearly 2 million user-created color schemes. You can view them sorted by date, rating, number of views.

ColoRotate has a library of pre-made color schemes. Also you can create your own scheme with the unique 3D tool. The color scheme can be used directly in Photoshop and Fireworks using the ColoRotate plugin.

The Color Scheme Designer allows you to select the type of color scheme (mono, complementary, triad, tetrad, analog). Then it will be possible to adjust the colors and see the effect of the scheme on an example.

ColorSchemer has a large library of user-created color schemes. You can sort them by date posted, rating, or number of downloads.

Pictaculous is a simple online color scheme generation tool. You can upload an image and the service will generate a diagram to use with the image.

Color Spire

Color Spire is a very easy to use service. You choose a base color and it suggests a color scheme. You can also see appearance schemes on a simple template.