Cascading Style Sheets allows you to specify few border properties. In last article we described the basic ones of border radius. Today we will look an equally important value – border color.
There are few ways to define it. In my opinion the simplest one is setting this by HEX value, as in the following example.
Next possible way is RGB or RGBA value, second one allows also to define alpha channel (opacity).
border-color: rgb(255, 0, 255);
border-color: rgba(255, 0, 255, 0.4);
A similar way to this with the values of rga and rgba is HSL, here you can also add alpha channel (in HSLA).
border-color: hsl(300, 100%, 50%);
border-color: hsla(300, 100%, 50%, 0.4);
Where to look for colors?
We can find a lot of usefull tools for this, probably one of most comfortable is Color Wheel, you can generate hex color code and get other values by clicking “get info about color”.