HTML color codes are one of the things you need to know when you want to design a website. Choosing the right colors in a web design can improve branding and play an important role in product sales.
According to data written by Dezinegirl Creative Studio in their article entitled "The Power of Color in Branding", they stated that color is the most powerful tool in branding. Studies show that product color can influence 80% of customers' purchasing decisions.
Unfortunately, currently there are still many site and business owners who are not aware of their design color choices. Therefore, in this article Erzedka will present a list of HTML color codes that you can use to create web designs. What are the HTML color codes? Keep reading until the end!
What is Color Code?
 |
| HTML Color Codes |
Color codes are a coding system used to determine and display colors in digital media. There are several types of color codes that are commonly used, such as RGB, HEX, and CMYK.
- RGB (Red, Green, Blue) – additive color code used to render colors on digital displays. RGB uses a combination of red, green and blue light with a value range of 0 – 255 to display various colors. The higher the RGB value, the brighter the resulting color. The RGB color code has a wider color spectrum range than CMYK so it can produce bright and vibrant colors as seen on a computer or smartphone screen.
- HEX – RGB color representation in hexadecimal format that can be read by browsers. The HEX code uses a 6-digit combination of numbers 0-9 and letters A-F, starting with a pound sign (#). This HEX code is often used in HTML and CSS to define colors on website elements, because it is a format that can be read by browsers.
- CMYK (Cyan, Magenta, Yellow, Key/Black) – a subtractive color code commonly used for printing. The color is produced from a mixture of cyan, magenta, yellow and black pigments ranging from 0-100%. CMYK is more suitable for use in designs that will be printed so that the colors can be reproduced accurately.
List of HTML Color Codes
After understanding each type of color code that is commonly used. The following is a complete list of HTML color codes that you can use as a guide for website design colors.
| Colour Name | HEX | RGB |
| Alice Blue | #F0F8FF | rgb(240, 248, 254) |
| Antique White | #FAEBD7 | rgb(251, 235, 217) |
| Aqua | #00FFFF | rgb(0, 255, 254) |
| Aquamarine | #7FFFD4 | rgb(115, 255, 216) |
| Azure | #F0FFFF | rgb(239, 255, 255) |
| Beige | #F5F5DC | rgb(245, 245, 223) |
| Bisque | #FFE4C4 | rgb(255, 227, 200) |
| Black | #000000 | rgb(0, 0, 0) |
| Blanched Almond | #FFEBCD | rgb(255, 234, 208) |
| Blue | #0000FF | rgb(0, 0, 255) |
| Blue Violet | #8A2BE2 | rgb(138, 43, 226) |
| Brown | #A52A2A | rgb(165, 42, 42) |
| Burly Wood | #DEB887 | rgb(222, 184, 135) |
| Cadet Blue | #5F9EA0 | rgb(95, 158, 160) |
| Chartreuse | #7FFF00 | rgb(127, 255, 1) |
| Chocolate | #D2691E | rgb(210, 105, 30) |
| Coral | #FF7F50 | rgb(251, 127, 80) |
| Cornflower Blue | #6495ED | rgb(100, 149, 237) |
| Cornsilk | #FFF8DC | rgb(225, 248, 220) |
| Crimson | #DC143C | rgb(220, 20, 60) |
| Cyan | #00FFFF | rgb(62, 254, 255) |
| Dark Blue | #00008B | rgb(0, 0, 139) |
| Dark Cyan | #008B8B | rgb(29, 139, 139) |
| Dark GoldenRod | #B8860B | rgb(184, 134, 11) |
| Dark Gray | #A9A9A9 | rgb(169, 169, 169) |
| Dark Green | #006400 | rgb(19, 100, 0) |
| Dark Khaki | #BDB76B | rgb(189, 183, 107) |
| Dark Magenta | #8B008B | rgb(139, 0, 140) |
| Dark Olive Green | #556B2F | rgb(85, 107, 47) |
| Dark Orange | #FF8C00 | rgb(251, 140, 1) |
| Dark Orchid | #9932CC | rgb(153, 50, 204) |
| Dark Red | #8B0000 | rgb(139, 5, 0) |
| Dark Salmon | #E9967A | rgb(233, 150, 122) |
| Dark Sea Green | #8FBC8F | rgb(143, 188, 144) |
| Dark Slate Blue | #483D8B | rgb(72, 61, 139) |
| Dark Slate Gray | #2F4F4F | rgb(47, 79, 79) |
| Dark Turquoise | #00CED1 | rgb(48, 206, 209) |
| Dark Violet | #9400D3 | rgb(148, 0, 211) |
| Deep Pink | #FF1493 | rgb(249, 19, 147) |
| Deep Sky Blue | #00BFFF | rgb(43, 191, 254) |
| Dim Gray | #696969 | rgb(105, 105, 105) |
| Dodger Blue | #1E90FF | rgb(30, 144, 255) |
| Fire Brick | #B22222 | rgb(178, 34, 33) |
| Floral White | #FFFAF0 | rgb(255, 250, 240) |
| Forest Green | #228B22 | rgb(34, 139, 35) |
| Fuchsia | #FF00FF | rgb(249, 0, 255) |
| Gainsboro | #DCDCDC | rgb(220, 220, 220) |
| Ghost White | #F8F8FF | rgb(248, 248, 255) |
| Gold | #FFD700 | rgb(253, 215, 3) |
| GoldenRod | #DAA520 | rgb(218, 165, 32) |
| Gray | #808080 | rgb(128, 128, 128) |
| Green | #008000 | rgb(27, 128, 1) |
| Green Yellow | #ADFF2F | rgb(173, 255, 48) |
| Honey Dew | #F0FFF0 | rgb(240, 255, 240) |
| Hot Pink | #FF69B4 | rgb(240, 255, 240) |
| Indian Red | #CD5C5C | rgb(205, 92, 92) |
| Indigo | #4B0082 | rgb(75, 0, 130) |
| Ivory | #FFFFF0 | rgb(255, 255, 239) |
| Khaki | #F0E68C | rgb(240, 230, 140) |
| Lavender | #E6E6FA | rgb(230, 230, 250) |
| Lavender Blush | #FFF0F5 | rgb(254, 240, 245) |
| Lawn Green | #7CFC00 | rgb(124, 252, 2) |
| Lemon Chiffon | #FFFACD | rgb(255, 250, 205) |
| Light Blue | #ADD8E6 | rgb(173, 216, 230) |
| Light Coral | #F08080 | rgb(240, 128, 128) |
| Light Cyan | #E0FFFF | rgb(224, 255, 255) |
| Light GoldenRod Yellow | #FAFAD2 | rgb(250, 250, 210) |
| Light Gray | #D3D3D3 | rgb(211, 211, 211) |
| Light Green | #90EE90 | rgb(144, 238, 144) |
| Light Pink | #FFB6C1 | rgb(252, 182, 193) |
| Light Salmon | #FFA07A | rgb(251, 160, 122) |
| Light Sea Green | #20B2AA | rgb(40, 178, 170) |
| Light Sky Blue | #87CEFA | rgb(135, 206, 250) |
| Light Slate Gray | #778899 | rgb(119, 136, 153) |
| Light Steel Blue | #B0C4DE | rgb(176, 196, 222) |
| Light Yellow | #FFFFE0 | rgb(255, 255, 224) |
| Lime | #00FF00 | rgb(63, 255, 0) |
| Lime Green | #32CD32 | rgb(50, 205, 50) |
| Linen | #FAF0E6 | rgb(250, 240, 230) |
| Magenta | #FF00FF | rgb(249, 0, 255) |
| Maroon | #800000 | rgb(128, 4, 0) |
| Medium Aquamarine | #66CDAA | rgb(102, 205, 170) |
| Medium Blue | #0000CD | rgb(0, 0, 205) |
| Medium Orchid | #BA55D3 | rgb(186, 85, 211) |
| Medium Purple | #9370DB | rgb(147, 112, 219) |
| Medium Sea Green | #3CB371 | rgb(60, 179, 113) |
| Medium Slate Blue | #7B68EE | rgb(123, 103, 238) |
| Medium Spring Green | #00FA9A | rgb(62, 250, 153) |
| Medium Turquoise | #48D1CC | rgb(72, 209, 204) |
| Medium Violet Red | #C71585 | rgb(199, 21, 133) |
| Midnight Blue | #191970 | rgb(25, 25, 112) |
| Mint Cream | #F5FFFA | rgb(245, 255, 250) |
| Misty Rose | #FFE4E1 | rgb(254, 228, 225) |
| Moccasin | #FFE4B5 | rgb(254, 228, 181) |
| Navajo White | #FFDEAD | rgb(254, 222, 173) |
| Navy | #000080 | rgb(0, 0, 128) |
| Old Lace | #FDF5E6 | rgb(253, 245, 230) |
| Olive | #808000 | rgb(128, 128, 1) |
| Olive Drab | #6B8E23 | rgb(107, 142, 35) |
| Orange | #FFA500 | rgb(252, 165, 3) |
| Orange Red | #FF4500 | rgb(250, 69, 1) |
| Orchid | #DA70D6 | rgb(218, 112, 214) |
| Pale Golden Rod | #EEE8AA | rgb(238, 232, 170) |
| Pale Green | #98FB98 | rgb(152, 251, 153) |
| Pale Turquoise | #AFEEEE | rgb(175, 238, 239) |
| Pale Violet Red | #DB7093 | rgb(219, 112, 147) |
| Papaya Whip | #FFEFD5 | rgb(254, 239, 213) |
| Peach Puff | #FFDAB9 | rgb(253, 218, 185) |
| Peru | #CD853F | rgb(205, 133, 63) |
| Pink | #FFC0CB | rgb(252, 192, 203) |
| Plum | #DDA0DD | rgb(221, 160, 221) |
| Powder Blue | #B0E0E6 | rgb(176, 224, 230) |
| Purple | #800080 | rgb(128, 0, 128) |
| Rebecca Purple | #663399 | rgb(102, 51, 153) |
| Red | #FF0000 | rgb(255, 0, 0) |
| Rosy Brown | #BC8F8F | rgb(188, 143, 142) |
| Royal Blue | #4169E1 | rgb(65, 105, 225) |
| Saddle Brown | #8B4513 | rgb(139, 69, 19) |
| Salmon | #FA8072 | rgb(250, 128, 114) |
| Sandy Brown | #F4A460 | rgb(244, 164, 95) |
| Sea Green | #2E8B57 | rgb(46, 139, 87) |
| Sea Shell | #FFF5EE | rgb(255, 245, 238) |
| Sienna | #A0522D | rgb(160, 82, 45) |
| Silver | #C0C0C0 | rgb(192, 192, 192) |
| Sky Blue | #87CEEB | rgb(135, 206, 235) |
| Slate Blue | #6A5ACD | rgb(106, 90, 205) |
| Slate Gray | #708090 | rgb(112, 128, 145) |
| Snow | #FFFAFA | rgb(255, 250, 250) |
| Spring Green | #00FF7F | rgb(63, 255, 128) |
| Steel Blue | #4682B4 | rgb(70, 130, 180) |
| Tan | #D2B48C | rgb(210, 180, 140) |
| Teal | #008080 | rgb(26, 128, 127) |
| Thistle | #D8BFD8 | rgb(216, 191, 216) |
| Tomato | #FF6347 | rgb(250, 99, 71) |
| Turquoise | #40E0D0 | rgb(64, 224, 208) |
| Violet | #EE82EE | rgb(238, 130, 238) |
| Wheat | #F5DEB3 | rgb(245, 222, 179) |
| White | #FFFFFF | rgb(255, 255, 255) |
| White Smoke | #F5F5F5 | rgb(245, 245, 245) |
| Yellow | #FFFF00 | rgb(255, 255, 0) |
| Yellow Green | #9ACD32 | rgb(154, 205, 49) |
What is the website that finds colors combinations?
After understanding the complete list of HTML color codes, you can then look for a suitable color combination or color palette for the web design you are going to create. Below are several web options that can be used.
1. Paletton
Paletton is a website that makes it easy for designers to find great palettes and color schemes. This website offers many features such as color wheel, harmony schemes, customization, export options, and many more.
On this website, you only need to choose a basic color and Paletton will generate a color palette based on that scheme. With the customization feature, users can customize and save their favorite color palettes which can be adjusted for saturation and brightness.
2. Coolors
The next site is coolors.co, on this website Coolors has a slightly different way of working compared to other color combination search sites. You have to choose colors randomly based on the colors provided by the website and then generate a complementary palette.
After the palette is formed, the user is still given full freedom to edit and adjust the colors in the palette. Users can change the HEX, RGB and HSL values of each color according to their preferences.
3. Canva
Canva can not only be used to design, but also to choose color combinations. Users can use Canva to explore and choose the right color combinations.
You can choose one basic color on the wheel and then matching complementary colors will automatically be displayed. The color palette feature allows the colors on the wheel to be entered into a palette so that the hexadecimal code is easy to see.
4. Adobe Color CC
Adobe Color Wheel is a feature provided by Adobe Color to select CSS color combinations for web design. Users can choose a base color on the wheel, then Adobe Color will automatically display various complementary colors, you can also set color combination schemes such as monochromatic, triad, complementary,
The color palette in Adobe Color can be edited and adjusted as well as imported into various Adobe design applications such as Illustrator and Photoshop so that it can be used directly. This site also provides the option to export color palettes in various formats such as CSS, SVG, and PDF.
5. Color Wheel Designs AI
Color Wheel Designs AI is an online tool provided by Designs.AI to help designers explore and select color combinations. Like other websites, there is a choice of several popular color combination schemes/rules such as monochromatic, analogous, complementary, etc.
The selected color can be saved to the palette to see its HEX code. Pallets can be arranged and customized. In addition, the contrast checker feature is able to display the contrast ratio between selected colors for optimal readability.
6. Mudcube Color Sphere
This site displays an interactive color wheel in the shape of a ball or sphere. How to use it is quite simple. You just have to slide the available slider or move the pointer around the color ball.
That way, the website will automatically display various harmonious color combination options based on certain color schemes such as monochromatic or complementary.
7. Color Explorer
Color Explorer allows you not only to experiment and find color combinations, but also apply the selected color combinations to various objects such as images, web page layouts, and so on.
Users can see a real-time preview of how the selected colors appear on various objects. Another interesting feature, users can also upload photos or images to Color Explorer to find out the color palette used in the image.
8. Spy Color
This site makes it easy for designers to search for and learn various types of color codes. The way it works is quite simple. You just need to enter a certain hexadecimal or RGB code, then SpyColor.
Apart from searching for color codes, SpyColor also provides visualization of color examples along with variations in tint (brightness) and shade (denseness). This feature allows designers to see in real-time how a color will appear in various levels of brightness and saturation.
9. HTML Color Code
HTML Color Codes website provides a complete collection of color codes in HTML formats such as HEX, RGB. This color code is presented in the form of a diagram and chart to make it easier for users to find and select the desired color.
HTML Color Codes is also equipped with a code conversion feature that can convert HEX values to RGB or HSL so that color codes can be used in different formats. This site also provides a random color code generator tool or based on certain RGB values.
10. W3School HTML Color Picker
W3Schools Color Picker is a feature of the W3Schools site that is used to select a base color on the color wheel and then adjust the saturation level to produce color variations.
There is also a real-time preview so users can see the color of their choice. Apart from selecting via the color wheel, users can also enter certain HEX or RGB color codes, then this tool automatically generates color code information in CSS, HTML and RGB formats.
Closing
Color coding plays an important role in website design and development. There are 3 color codes that are commonly used, including RGB (Red, Green, Blue), an additive color code that is suitable for display on digital screens. HEX, an RGB-based color code that is widely used in HTML and CSS. CMYK (Cyan, Magenta, Yellow, Black) is a subtractive color code suitable for printing.
Understanding the characteristics of various color codes is important so that the website design looks clear and is able to attract visitors' attention to your website or brand.
After choosing the HTML color code for your website, don't forget to use the right hosting to support your website to make it more reliable.