Re: [csswg-drafts] [css-borders-4] Allow overriding single-shape `border-shape` color/width (#13506)

If I understand correctly, the main intent here is to decouple the border stroke width from the border box width, right?

So the example above could be expressed as:

```css
border: 20px solid;
border-shape: var(--cloudy-shape);
border-shape-stroke-color: red;
border-shape-stroke-width: 2px;
```

Meaning, when `border-shape-stroke-color` is set, it overwrites the color set by the related `border-*-color` property.
And you mixed it up a little, but I think you also want to introduce a shorthand called `border-shape-stroke`.

Are those assumptions correct?

If so, I have two alternative approaches to this:

1. Introduce a `border-box-width` property with `from-border-width | <line-width>{1,4}` as syntax that controls the border box size with `from-border-width` as initial value. The `border-*-width` properties then only define the rendering width of the border.

So the CSS for the example above would then look like this:

```css
border-box-width: 20px;
border: 2px solid red;
border-shape: var(--cloudy-shape);
```

2. Just call it `border-stroke` (and `border-stroke-width` and `border-stroke-color`, respectively) and let it also apply without the border shape. E.g. a `border: 20px solid; border-stroke: 2px red;` would create a 20px wide border box but only draw a 2px red stroke into it.

The CSS for the example above could then look like this:

```css
border: 20px solid;
border-shape: var(--cloudy-shape);
border-stroke: 2px red;
```

Sebastian

-- 
GitHub Notification of comment by SebastianZ
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/13506#issuecomment-4909503748 using your GitHub account


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

Received on Tuesday, 7 July 2026 22:11:01 UTC