-
- Mağaza Tasarımı
- ARÇELİK Mağaza
- Arçelik Mağaza
- Shangri la mall Sri
- womens clothing
- Konsept Dükkan
- BEKO Mağaza Tasarımı
- Vestel Store
- Coffe shop interior
- 3D showroom home
- Bookstore 3D Design
- Kaduwella Singer
- Vestel Store Design
- Mağaza Tasarımı
- Showroom Tasarımı
- Showroom Tasarımı
- Showroom Tasarımı
- SINGER Mega
Famous Quotes
Project Detail
Colors and Codes html
| #f0f8ff | #ffffff | #f4f4f4 | #000000 | #7eddfc | #c9c9c9 | #3ff260 | #9496d6 |
| #9fb7cc | #aaaa77 | #fad6b9 | #a7bf4e | #d09cd6 | #d6923e | #facf78 | #faf878 |
HTML color shades
Colors consist of a red, green, and blue element. But what happens when a color contains just a red element? or just a green or blue element? What about if a color consists of equal amounts of red, green, and blue?This tutorial focuses on:
- Red shades
- Green shades
- Blue shades
- Equal amount of shades
- Gradients
Red shades
You can create a bunch of red shades by setting the red part of a color to anything above zero, and the green and blue parts to 0.| Shade | Hex value | RGB value |
|---|---|---|
| #000000 | rgb(0,0,0) | |
| #080000 | rgb(8,0,0) | |
| #100000 | rgb(16,0,0) | |
| #180000 | rgb(24,0,0) | |
| #200000 | rgb(32,0,0) | |
| #280000 | rgb(40,0,0) | |
| #300000 | rgb(48,0,0) | |
| #380000 | rgb(56,0,0) | |
| #400000 | rgb(64,0,0) | |
| #480000 | rgb(72,0,0) | |
| #500000 | rgb(80,0,0) | |
| #580000 | rgb(88,0,0) | |
| #600000 | rgb(96,0,0) | |
| #680000 | rgb(104,0,0) | |
| #700000 | rgb(112,0,0) | |
| #780000 | rgb(120,0,0) | |
| #800000 | rgb(128,0,0) | |
| #880000 | rgb(136,0,0) | |
| #900000 | rgb(144,0,0) | |
| #980000 | rgb(152,0,0) | |
| #A00000 | rgb(160,0,0) | |
| #A80000 | rgb(168,0,0) | |
| #B00000 | rgb(176,0,0) | |
| #B80000 | rgb(184,0,0) | |
| #C00000 | rgb(192,0,0) | |
| #C80000 | rgb(200,0,0) | |
| #D00000 | rgb(208,0,0) | |
| #D80000 | rgb(216,0,0) | |
| #E00000 | rgb(224,0,0) | |
| #E80000 | rgb(232,0,0) | |
| #F00000 | rgb(240,0,0) | |
| #F80000 | rgb(248,0,0) | |
| #FF0000 | rgb(255,0,0) |
<table border="1" cellpadding="5" width="90%"> <tr> <td bgcolor="#d62735">Red shades</td> <td bgcolor="#d30e0e">altered by</td> </tr> <tr> <td bgcolor="#870909">blue and green</td> <td bgcolor="#f73131">mixture</td> </tr> </table>
Output:
| Red shades | altered by |
| blue and green | mixture |
Green shades
You can create a bunch of green shades by setting the green part of a color to anything above zero, and the red and blue parts to 0.| Shade | Hex value | RGB value |
|---|---|---|
| #000000 | rgb(0,0,0) | |
| #000800 | rgb(0,8,0) | |
| #001000 | rgb(0,16,0) | |
| #001800 | rgb(0,24,0) | |
| #002000 | rgb(0,32,0) | |
| #002800 | rgb(0,40,0) | |
| #003000 | rgb(0,48,0) | |
| #003800 | rgb(0,56,0) | |
| #004000 | rgb(0,64,0) | |
| #004800 | rgb(0,72,0) | |
| #005000 | rgb(0,80,0) | |
| #005800 | rgb(0,88,0) | |
| #006000 | rgb(0,96,0) | |
| #006800 | rgb(0,104,0) | |
| #007000 | rgb(0,112,0) | |
| #007800 | rgb(0,120,0) | |
| #008000 | rgb(0,128,0) | |
| #008800 | rgb(0,136,0) | |
| #009000 | rgb(0,144,0) | |
| #009800 | rgb(0,152,0) | |
| #00A000 | rgb(0,160,0) | |
| #00A800 | rgb(0,168,0) | |
| #00B000 | rgb(0,176,0) | |
| #00B800 | rgb(0,184,0) | |
| #00C000 | rgb(0,192,0) | |
| #00C800 | rgb(0,200,0) | |
| #00D000 | rgb(0,208,0) | |
| #00D800 | rgb(0,216,0) | |
| #00E000 | rgb(0,240) | |
| #00E800 | rgb(0,232,0) | |
| #00F000 | rgb(0,240,0) | |
| #00F800 | rgb(0,248,0) | |
| #00FF00 | rgb(0,255,0) |
<table border="1" cellpadding="5" width="90%"> <tr> <td bgcolor="#d62735">Greenshades</td> <td bgcolor="#d30e0e">altered by</td> </tr> <tr> <td bgcolor="#870909">blue and red</td> <td bgcolor="#f73131">mixture</td> </tr> </table>
Output:
| Green shades | altered by |
| blue and red | mixture |
Blue shades
You can create a bunch of blue shades by setting the blue part of a color to anything above zero, and the red and green parts to 0.| Shade | Hex value | RGB value |
|---|---|---|
| #000000 | rgb(0,0,0) | |
| #000008 | rgb(0,0,8) | |
| #000010 | rgb(0,0,16) | |
| #000018 | rgb(0,0,24) | |
| #000020 | rgb(0,0,32) | |
| #000028 | rgb(0,0,40) | |
| #000030 | rgb(0,0,48) | |
| #000038 | rgb(0,0,56) | |
| #000040 | rgb(0,0,64) | |
| #000048 | rgb(0,0,72) | |
| #000050 | rgb(0,0,80) | |
| #000058 | rgb(0,0,88) | |
| #000060 | rgb(0,0,96) | |
| #000068 | rgb(0,0,104) | |
| #000070 | rgb(0,0,112) | |
| #000078 | rgb(0,0,120) | |
| #000080 | rgb(0,0,128) | |
| #000088 | rgb(0,0,136) | |
| #000090 | rgb(0,0,144) | |
| #000098 | rgb(0,0,152) | |
| #0000A0 | rgb(0,0,160) | |
| #0000A8 | rgb(0,0,168) | |
| #0000B0 | rgb(0,0,176) | |
| #0000B8 | rgb(0,0,184) | |
| #0000C0 | rgb(0,0,192) | |
| #0000C8 | rgb(0,0,200) | |
| #0000D0 | rgb(0,0,208) | |
| #0000D8 | rgb(0,0,216) | |
| #0000E0 | rgb(0,0,240) | |
| #0000E8 | rgb(0,0,232) | |
| #0000F0 | rgb(0,0,240) | |
| #0000F8 | rgb(0,0,248) | |
| #0000FF | rgb(0,0,255) |
<table border="1" cellpadding="5" width="90%"> <tr> <td bgcolor="#334980">Blue shades</td> <td bgcolor="#5274cc">altered by</td> </tr> <tr> <td bgcolor="#a3afcc">red and green</td> <td bgcolor="#494f6e">mixture</td> </tr> </table>
Output:
| Blue shades | altered by |
| red and green | mixture |
Equal amount of shades
What happens when you apply an equal amount of red, green, and blue? You get gray!| Shade | Hex value | RGB value |
|---|---|---|
| RGB(0,0,0) | #000000 | |
| RGB(8,8,8) | #080808 | |
| RGB(16,16,16) | #101010 | |
| RGB(24,24,24) | #181818 | |
| RGB(32,32,32) | #202020 | |
| RGB(40,40,40) | #282828 | |
| RGB(48,48,48) | #303030 | |
| RGB(56,56,56) | #383838 | |
| RGB(64,64,64) | #404040 | |
| RGB(72,72,72) | #484848 | |
| RGB(80,80,80) | #505050 | |
| RGB(88,88,88) | #585858 | |
| RGB(96,96,96) | #606060 | |
| RGB(104,104,104) | #686868 | |
| RGB(112,112,112) | #707070 | |
| RGB(120,120,120) | #787878 | |
| RGB(128,128,128) | #808080 | |
| RGB(136,136,136) | #888888 | |
| RGB(144,144,144) | #909090 | |
| RGB(152,152,152) | #989898 | |
| RGB(160,160,160) | #A0A0A0 | |
| RGB(168,168,168) | #A8A8A8 | |
| RGB(176,176,176) | #B0B0B0 | |
| RGB(184,184,184) | #B8B8B8 | |
| RGB(192,192,192) | #C0C0C0 | |
| RGB(200,200,200) | #C8C8C8 | |
| RGB(208,208,208) | #D0D0D0 | |
| RGB(216,216,216) | #D8D8D8 | |
| RGB(224,224,224) | #E0E0E0 | |
| RGB(232,232,232) | #E8E8E8 | |
| RGB(240,240,240) | #F0F0F0 | |
| RGB(248,248,248) | #F8F8F8 | |
| RGB(255,255,255) | #FFFFFF |
<table border="1" cellpadding="5" width="90%"> <tr> <td bgcolor="#babba8">Gray shades</td> <td bgcolor="#786b63">where the</td> </tr> <tr> <td bgcolor="#a09a8b">red, green, and blue</td> <td bgcolor="#8b8c85">parts are are a different value</td> </tr> </table>
Output:
| Gray shades | where the |
| red, green, and blue | parts are a different value |
Gradients
When it comes to color, sometimes you have more than one color to choose from and you don't know which one to choose. In such a scenario, sometimes you can choose more than one.Have you ever seen one of those fading backgrounds some webpages have? You know, the one where it starts out as one color and changes through several different colors? Here is an example of this.
This type of fading color background is called a gradient and can add that extra dazzle to a webpage to make it more attractive. You can make your own gradients using Adobe Photoshop and many other image editing programs or online at the online gradient maker.
| Verdana, Arial, Helvetica - size=4 | Sample | font face="Verdana,Arial,Helvetica size="4" color="black" |
| Arial - size=4 | Sample | font face="Arial" size="4" color="green" |
| Impact - size=9 | Sample | font face="Impact" size="9" color="red" |
| Courier - size=4 | Sample | font face="Courier" size="4" color="blue" |
| Courier New - size=4 | Sample | font face="Courier New" size="4" color="blue" |
| Book Antigua - size=6 | Sample | font face="Book Antigua" size="6" |
| Bookman Old Style - size=3 | Sample | font face="Bookman Old Style" font size="3" color="orange" |
| Century Gothic - size=6 | Sample | font face="Century Gothic" size="6" color="purple" |
| Times New Roman - size=4 | Sample | font face="Times New Roman" font size="4" color="black" |
| Times New Roman italicized - size=4 | Sample | font face="Times New Roman" font size="4" color="black" |
| Times New Roman italicized & bold - size=4 | Sample | font face="Times New Roman" size="4" color="black" |
| Modern - size=5 | Sample | font face="Modern" size="5" color="black" |
| Modern,Arial - size=5 | Sample | font face="Modern,Arial" size="5" color="blue" |
Global booth design
-
Booth Expo Design
Umay Tech Exhibition Booth Design
-
Booth Expo Design
Natural Enerji Exhibition Booth Design
-
Booth Expo Design
Ülker Exhibition Stand Design
-
Booth Expo Design
Exhibition / Fair Stand Design / PANDA London
-
Booth Expo Design
Fair Stand Design
-
Booth Expo Design
Creative stand design for ceramics fair
Showroom Design
-
Showroom Design
Lanka Tiles Palawatte Showroom Design
-
Showroom Design
Arçelik Mağaza Tasarımı
-
Showroom Design
Singer Mega Nugegoda Showroom 2022 New Design
-
Showroom Design
ROCELL Stone Showroom Concept Design
-
Showroom Design
Lanka Tiles Showroom 2022 New Concept Design
-
Showroom Design
Hotel Restourant VIP concept interior design
Other news
News >- Umay Tech Exhibition Booth Design
- Natural Enerji Exhibition Booth Design
- Ülker Exhibition Stand Design
- Exhibition / Fair Stand Design / PANDA London
- Fair Stand Design
- Creative stand design for ceramics fair
- Modern and Elegant Exhibition Stand Design for a Leading Food Company
- Advanced Communication Technology Stand Design
- Explore the Underwater Wonders of Türkiye: Dive into the Experience
- Cosmolive's Natural and Modern Appeal
- Sleek and Contemporary Stand Design
- Striking Elegance: A Modern Trade Show Stand Design
- Innovative Exhibition Stands Reflecting the Future of Technology
- Modern and Elegant Exhibition Stand for Quartz Surfaces
- Innovative Exhibition Stand Design for a Small Machinery Manufacturing Company



