CSS border color
Created By: chatGPT
The border-color property in CSS is used to set the color of the borders of an element. You can specify the color using various formats such as color names, hexadecimal, RGB, or HSL values. This property is shorthand for setting the color of all four borders (top, right, bottom, left) of a box model element independently. If a border style is not applied, the border-color will not be visible.
/* Setting border color using color names */
.element {
border: 2px solid blue;
}
/* Using hexadecimal color codes */
.element {
border: 2px solid #FF5733;
}
/* Using RGB color values */
.element {
border: 2px solid rgb(255, 87, 51);
}
/* Using HSL color values */
.element {
border: 2px solid hsl(12, 100%, 60%);
}
/* Setting different colors for each border */
.element {
border-top: 2px solid red;
border-right: 2px solid green;
border-bottom: 2px solid blue;
border-left: 2px solid yellow;
}