Outline color


Set the color used to draw the element's outline ("outside-the-box" border).

Property values

Unlike many other similar properties, the outline-color property does not have corresponding top, right, bottom and left properties. Outline-color rules can only be set for all four sides at once.

Specify the outline color using any one of these color value formulas:

formula red green blue
'currentColor' Use the text's color
'invert' Invert the background color
6-digit hex #ff0000 #00ff00 #0000ff
3-digit hex #f00 #0f0 #00f
RGB rgb(255,0,0) rgb(0,255,0) rgb(0,0,255)
RGBA rgb(255,0,0,1.0) rgb(0,255,0,1.0) rgb(0,0,255,1.0)
HSL hsl(0,100,50) hsl(120,100,50) hsl(240,100,50)
HSLA hsla(0,100,50,1.0) hsla(120,100,50,1.0) hsla(240,100,50,1.0)
CSS names aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow *

The fourth item of the RGBA and HSLA formulas is a transparency/opacity value, from 0.0 (fully transparent) to 1.0 (fully opaque).

* Only the first 16 standard CSS colors are listed. There are 124 more defined in the X11 color standard.


outline-color: yellow;

style > framing > outline-colorOutline color

🔗 🔎