CSS - Outline Color


   CSS - Outline Color 

  • The outline color property is used in CSS, to choose the color for outline

  • Outline-color property value should either be a color name, a hex color, or an RGB value.

Sample Code :

<!DOCTYPE html>
<html>
    <head>
    </head>
        <body>
            <p style="outline-width: thin; outline-style: solid; outline-color: red">
            Welcome To WikiTechy.com
            </p>
            <br />
            <p style="outline-width: thick; outline-style: dashed; outline-color:#009900">
            Find Solutions For All Technology Errors.
            </p>
            <br />
            <p style="outline-width:5px;outline-style:dotted;outline-color:rgb(13,33,232)">
            Best E-Learning Website in The World.
            </p>
        </body>
</html>

Code Explanation :


    In CSS, outline-color: red is used for applying red color for the outline around p tag.

    Here, we are Applying hexadecimal color values for outline in outline-color property.

Note : RGB values can also be assigned using hexadecimal color values in the form of: #RRGGBB, where RR (red), GG (green) and BB (blue) are hexadecimal values between 00 and FF (same as decimal 0-255).

    Here, p element was defined for the statement “Best E-Learning Website in the World” where the outline for the statement is applied with RGB Colors values which specify its color values based on the formula (red, green, and blue).

Output :


    Here red color value is applied for the outline around the text “Welcome To WikiTechy.com”.

    The Text “Find Solutions For All Technology Errors” will have a outline in green color outline which is specified in Hexadecimal

    Over here, the RGB color values is applied for the text “Best E-Learning Website in the World.” which will be displayed with blue color outline.