[csswg-drafts] [css-borders-4] Concave corner-shape and inset box-shadow (#12961)

noamr has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-borders-4] Concave corner-shape and inset box-shadow ==
The default implementation of inset box-shadow reduces the radius by the spread. This creates situations with concave corners might look "technically" like something that resembles a shadow but doesn't match the "strokey" concept of box-shadow.

For example, this is the current spec-compliant result of the following CSS:
```css
#target {
  width: 200px;
  height: 200px;
  border-radius: 70px;
  corner-shape: scoop bevel notch squircle;
  background: lightgreen;
  border: 10px solid orange;
  box-shadow: 0 0 0 10px inset; 
}
```

<img width="476" height="482" alt="Image" src="https://github.com/user-attachments/assets/e5be31f1-7819-4ddd-a8a6-4df0618fac84" />

The black shadow does look like something that *could* be a shadow, but could also feel strange given the behavior of normal (outset) box-shadow spread.

Alternatives I can think of:
1. Leave as is
2. Render inset shadows as strokes, and apply the inverse of the corner-smoothing algorithm. This would make inset shadows look like the inverse of the equivalent outset shadows.


Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/12961 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Thursday, 16 October 2025 15:07:28 UTC