CSS - outline-color



The outline-color property sets the color for an outline around an element.

Possible Values

  • <color> − Any valid color value. Color can be any name, hex, RGB, HSL.

  • invert − The outline performs a color inversion of the area where it is drawn. Note that browsers are not required to support this value; if they don't, this keyword is considered invalid.

Applies to

All the HTML elements.

DOM Syntax

object.style.outlineColor = "red";

CSS outline-color - <color> Value

Here is the example −

<html>
<head>
</head>
<body>
   <p style = "outline-width:thin; outline-style:solid;outline-color:red">
      outline-color is set to red outline.
   </p>
   <p style = "outline-width:thin; outline-style:dashed;outline-color:#009900">
      outline-color is set to HEX color as outline.
   </p>
   <p style = "outline-width:thin;outline-style:dotted;outline-color:rgb(13,33,232)">
      outline-color is set to RGB color as outline.
   </p>
   <p style = "outline-width:thin;outline-style:solid;outline-color:hsl(2, 100%, 50%)">
      outline-color is set to HSL color as outline.
   </p>
   <p style = "outline-width:thin;outline-style:solid;outline-color:invert">
      outline-color is set to invert as outline.
   </p>
</body>
</html>
Advertisements