February 17Feb 17 Administrators HTML Colors HTML colors are specified with predefined color names, or with RGB, HEX, HSL, RGBA, or HSLA values. Color Names In HTML, a color can be specified by using a color name: Tomato Orange DodgerBlue MediumSeaGreen Gray SlateBlue Violet LightGray Try it Yourself » HTML supports 140 standard color names. Background Color You can set the background color for HTML elements: Hello World Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Example <h1 style="background-color:DodgerBlue;">Hello World</h1><p style="background-color:Tomato;">Lorem ipsum...</p> Text Color You can set the color of text: Hello World Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Example <h1 style="color:Tomato;">Hello World</h1><p style="color:DodgerBlue;">Lorem ipsum...</p><p style="color:MediumSeaGreen;">Ut wisi enim...</p> Border Color You can set the color of borders: Hello World Hello World Hello World Example <h1 style="border:2px solid Tomato;">Hello World</h1><h1 style="border:2px solid DodgerBlue;">Hello World</h1><h1 style="border:2px solid Violet;">Hello World</h1> Color Values In HTML, colors can also be specified using RGB values, HEX values, HSL values, RGBA values, and HSLA values. The following three <div> elements have their background color set with RGB, HEX, and HSL values: rgb(255, 99, 71) #ff6347 hsl(9, 100%, 64%) The following two <div> elements have their background color set with RGBA and HSLA values, which add an Alpha channel to the color (here we have 50% transparency): rgba(255, 99, 71, 0.5) hsla(9, 100%, 64%, 0.5) Example <h1 style="background-color:rgb(255, 99, 71);">...</h1><h1 style="background-color:#ff6347;">...</h1><h1 style="background-color:hsl(9, 100%, 64%);">...</h1><h1 style="background-color:rgba(255, 99, 71, 0.5);">...</h1><h1 style="background-color:hsla(9, 100%, 64%, 0.5);">...</h1> Learn more about Color Values You will learn more about RGB, HEX and HSL in the next chapters. Video: HTML Colors
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.