Color Code
Color Code Chart for Website Design, Graphics & Photoshop
Free Color Code Chart for Website Design, Graphics & Photoshop
In graphic design and web development, color code charts play a crucial role in helping designers and developers choose the right colors easily. Below is a comprehensive color code chart for website design, graphics, and Photoshop.
Color | HEX Code | Color Name |
---|---|---|
#EEEEEE | Light Gray | |
#DDDDDD | Pale Gray | |
#CCCCCC | Medium Gray | |
#BBBBBB | Lighter Gray | |
#AAAAAA | Dark Gray | |
#999999 | Standard Gray | |
#888888 | Darker Gray | |
#777777 | Grayish Gray | |
#666666 | Dark Gray | |
#555555 | Deep Gray | |
#444444 | Stone Gray | |
#333333 | Charcoal Gray | |
#222222 | Light Black | |
#111111 | Dark Black | |
#000000 | Black | |
#FF0000 | Red | |
#EE0000 | Deep Red | |
#DD0000 | Bright Red | |
#CC0000 | Darker Red | |
#BB0000 | Crimson | |
#AA0000 | Blood Red | |
#990000 | Maroon | |
#880000 | Deep Bright Red | |
#770000 | Dark Red | |
#660000 | Deep Crimson | |
#550000 | Deep Dark Red | |
#440000 | Dark Blood Red | |
#330000 | Deep Maroon | |
#220000 | Dark Burgundy | |
#110000 | Blackish Crimson | |
#FFFFFF | White | |
#FFFFCC | Light Yellow | |
#FFFF99 | Bright Yellow | |
#FFFF66 | Lemon Yellow | |
#FFFF33 | Vivid Yellow | |
#FFFF00 | Yellow | |
#CCFFFF | Light Blue | |
#CCFFCC | Light Green | |
#CCFF99 | Bright Green | |
#CCFF66 | Fresh Green | |
#CCFF33 | Deep Green | |
#CCFF00 | Vivid Green | |
#99FFFF | Light Ocean Blue | |
#99FFCC | Soft Light Green | |
#99FF99 | Fresh Light Green | |
#99FF66 | Bright Neon Green | |
#99FF33 | Deep Neon Green | |
#99FF00 | Striking Neon Green | |
#66FFFF | Bright Blue | |
#66FFCC | Vibrant Fresh Green | |
#66FF99 | Cool Bright Green | |
#66FF66 | Neon Light Green | |
#66FF33 | Intense Bright Green | |
#66FF00 | Vivid Neon Green | |
#33FFFF | Bright Ocean Blue | |
#33FFCC | Deep Vibrant Fresh Green | |
#33FF99 | Bright Cool Green | |
#33FF66 | Vivid Deep Green | |
#33FF33 | Light Green | |
#33FF00 | Bright Neon Green | |
#00FFFF | Cyan | |
#00FFCC | Turquoise | |
#00FF99 | Bright Turquoise | |
#00FF66 | Bright Deep Green | |
#00FF33 | Striking Green | |
#00FF00 | Green | |
#FFCCFF | Pastel Pink | |
#FFCCCC | Light Pink | |
#FFCC99 | Peach | |
#FFCC66 | Sunset Pink | |
#FFCC33 | Bright Peach | |
#FFCC00 | Golden Pink | |
#CCCCFF | Soft Light Blue | |
#CCCCCC | Light Gray | |
#CCCC99 | Light Grayish Blue | |
#CCCC66 | Deep Light Gray | |
#CCCC33 | Bright Gray | |
#CCCC00 | Deep Yellow | |
#99CCFF | Cool Bright Blue | |
#99CCCC | Soft Turquoise | |
#99CC99 | Soft Green | |
#99CC66 | Vibrant Light Green | |
#99CC33 | Fresh Green | |
#99CC00 | Soft Yellow | |
#66CCFF | Bright Blue | |
#66CCCC | Bright Turquoise | |
#66CC99 | Deep Green | |
#33CC66 | Bright Deep Green | |
#33CC33 | Light Green | |
#33CC00 | Leaf Green | |
#00CCFF | Deep Ocean Blue | |
#00CCCC | Deep Turquoise | |
#33CC66 | Vivid Deep Green | |
#33CC33 | Bright Light Green | |
#00CC99 | Cool Turquoise | |
#00CC66 | Deep Cool Green | |
#00CC33 | Refreshing Green | |
#00CC00 | Bright Deep Green | |
#FF99FF | Bright Pink | |
#FF99CC | Blush Pink | |
#FF9999 | Soft Pink | |
#FF9966 | Bright Orange | |
#FF9933 | Deep Orange | |
#FF9900 | Golden Orange | |
#CC99FF | Soft Purple | |
#CC99CC | Pastel Purple | |
#CC9999 | Soft Pink | |
#CC9966 | Golden Orange | |
#CC9933 | Deep Orange | |
#CC9900 | Dark Golden Orange | |
#9999FF | Light Blue | |
#9999CC | Cool Light Blue | |
#999999 | Light Gray | |
#999966 | Light Yellow | |
#999933 | Yellow Green | |
#999900 | Brownish Yellow | |
#6699FF | Bright Light Blue | |
#6699CC | Bright Turquoise | |
#669999 | Bright Green | |
#669966 | Light Green | |
#669933 | Bright Orange | |
#669900 | Deep Yellow Green | |
#FF00FF | Fuchsia Pink | |
#FF00CC | Vivid Pink | |
#FF0099 | Deep Pink | |
#FF0066 | Dark Pink | |
#FF0033 | Reddish Pink | |
#FF0000 | Bright Red | |
#CC00FF | Fuchsia Purple | |
#CC00CC | Deep Purple | |
#CC0099 | Purple Pink | |
#CC0066 | Deep Purple Pink | |
#CC0033 | Reddish Purple | |
#CC0000 | Dark Red | |
#9900FF | Bright Purple | |
#9900CC | Deep Purple | |
#990099 | Dark Purple Pink | |
#990066 | Dark Purple Red | |
#990033 | Wine Red | |
#990000 | Burgundy | |
#6600FF | Light Purple | |
#6600CC | Bright Dark Purple | |
#660099 | Strong Purple | |
#660066 | Purple Red | |
#660033 | Light Red | |
#660000 | Grape Red | |
#3300FF | Pastel Purple | |
#3300CC | Faded Dark Purple | |
#330099 | Brown Purple | |
#330066 | Greenish Purple | |
#330033 | Light Red | |
#330000 | Blackened Red | |
#0000FF | Dark Blue | |
#0000CC | Bright Blue | |
#000099 | Blackish Blue | |
#000066 | Navy Blue | |
#000033 | Charcoal Blue | |
#00FF00 | Fresh Green | |
#00EE00 | Dark Green | |
#00DD00 | Light Green | |
#00CC00 | Bright Fresh Green | |
#00BB00 | Lush Green | |
#00AA00 | Dark Moss Green | |
#009900 | Grass Green | |
#008800 | Dark Green | |
#007700 | Dark Forest Green | |
#006600 | Dark Forest Green | |
#005500 | Deep Light Green | |
#004400 | Blackened Green | |
#003300 | Dark Green | |
#002200 | Deep Dark Green | |
#001100 | Dim Dark Green | |
#0000FF | Blue | |
#0000EE | Light Blue | |
#0000DD | Deep Light Blue | |
#0000CC | Faded Blue | |
#0000BB | Light Faded Blue | |
#0000AA | Dim Light Blue |
1. HEX & RGB Color Codes for Website Design
HEX and RGB are the two most commonly used color systems in web development.
Color | HEX Code | RGB (Red, Green, Blue) |
---|---|---|
Red | #FF0000 | 255, 0, 0 |
Green | #00FF00 | 0, 255, 0 |
Blue | #0000FF | 0, 0, 255 |
White | #FFFFFF | 255, 255, 255 |
Black | #000000 | 0, 0, 0 |
Yellow | #FFFF00 | 255, 255, 0 |
Orange | #FFA500 | 255, 165, 0 |
Purple | #800080 | 128, 0, 128 |
Color codes help standardize and reuse colors in design and development. The most common color systems include:
- HEX & RGB: Used in website design.
- CMYK: Used in printing and graphic design.
- HSL: Used in photo editing, especially in Photoshop.
2. CMYK Color Codes for Printing & Graphics
CMYK (Cyan, Magenta, Yellow, Black) is the primary color system used in printing.
Color | CMYK (Cyan, Magenta, Yellow, Black) |
---|---|
Red | 0, 100, 100, 0 |
Green | 100, 0, 100, 0 |
Blue | 100, 100, 0, 0 |
White | 0, 0, 0, 0 |
Black | 0, 0, 0, 100 |
Yellow | 0, 0, 100, 0 |
Orange | 0, 50, 100, 0 |
Purple | 50, 100, 0, 0 |
Why Are HEX and RGB Important for Web Design?
- HEX Codes are widely used in web platforms.
- RGB Codes ensure accurate color display on electronic screens.
3. Photoshop Color Codes (HSL)
In Photoshop, the HSL (Hue, Saturation, Lightness) color system is used for color editing and fine-tuning.
Color | HSL (Hue, Saturation, Lightness) |
---|---|
Red | 0, 100%, 50% |
Green | 120, 100%, 50% |
Blue | 240, 100%, 50% |
White | 0, 0%, 100% |
Black | 0, 0%, 0% |
Yellow | 60, 100%, 50% |
Orange | 39, 100%, 50% |
Purple | 280, 100%, 50% |
Why Is HSL Important in Photoshop?
- HSL allows easy adjustment of hue, saturation, and brightness.
- Helps create special color effects and enhance image realism.
What is a Color Code Chart? Complete Color Code Guide for Website, Graphics & Photoshop
Colors play an essential role in web design, graphic design, and photo editing. A color code chart helps designers and developers select the right colors to maintain consistency in their work. But what exactly is a color code chart? Let’s explore in detail!
Conclusion
A color code chart is an essential tool in website design, graphics, and Photoshop. Understanding different color systems allows you to choose the right colors and optimize your designs effectively.
Understanding and using color codes correctly will help you optimize designs and maintain consistency in graphics and web development. Save this chart for future reference!
Would you like to add any additional color codes? Leave a comment below!