Control the two colors of an inset border?

Question

I'm trying to see if there's a way to change the two colors of the inset border in CSS

As you know, the inset style creates a border on an element that creates the illusion that that it has an embedded border. It achieves this by making the bottom and right border the color you selected, and changes the color of the top and left border a slightly darker shade.

Does anyone know of a way where you can control how dark, or maybe even different color the alternate shade would be?

#myElement{
    border: inset 1px white;
}

Thanks.

Answer 1

I don't think you can control it the way I mentioned, but for sure you can control the individual color of each border:

#myElement{
  border-style: solid;
  border-width: 1px;
  border-top-color: black;
  border-left-color: black;
  border-right-color: white;
  border-bottom-color: white;
}