Intent to Ship: CSS text-decoration-inset

[Helmut Januschka]

Contact emails

hjanu...@gmail.com

Specification

https://drafts.csswg.org/css-text-decor-4/#propdef-text-decoration-inset

Summary

CSS text-decoration-inset controls how far underlines, overlines, and line-through decorations are inset from or extended beyond text run edges. It supports auto, length, and percentage values, including one-value and two-value syntax for setting the start and end offsets. This lets developers adjust decoration spacing and create reveal effects with native text decorations instead of background gradients or additional elements. 

sampler: https://static.januschka.com/i-468928416/?asddsaasd 

MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/text-decoration-inset 

CL: https://chromium-review.googlesource.com/c/chromium/src/+/7748204

Blink component

Blink>CSS

Web Feature ID

text-decoration

Motivation

This change implements CSS text-decoration-inset (CSS Text Decoration Level 4), including percentage values. It gives authors direct control over decoration inset and reduces the need for wrapper/pseudo-element workarounds used to fine-tune underline/overline/line-through rendering. 

Initial public proposal

No information provided

TAG review

No information provided

TAG review status

Not applicable

Goals for experimentation

None

Risks

Interoperability and Compatibility

No information provided

Gecko: No signal

WebKit: No signal

Web developers: No signals

Other signals:

WebView application risks

Does this intent deprecate or change behavior of existing APIs, such that it has potentially high risk for Android WebView-based applications?

No information provided

Debuggability

No information provided

Will this feature be supported on all six Blink platforms (Windows, Mac, Linux, ChromeOS, Android, and Android WebView)?

No

Is this feature fully tested by web-platform-tests?

Yes

Flag name on about://flags

No information provided

Finch feature name

CSSTextDecorationInset

Rollout plan

Will ship enabled for all users

Requires code in //chrome?

False

Tracking bug

https://issues.chromium.org/issues/468928416

Estimated milestones

Shipping on desktop	154
Shipping on Android	154
Shipping on WebView	154
Shipping on iOS	154

Anticipated spec changes

Open questions about a feature may be a source of future web compat or interop issues. Please list open issues (e.g. links to known github issues in the project for the feature specification) whose resolution may introduce web compat/interop risk (e.g., changing to naming or structure of the API in a non-backward-compatible way).

No information provided

Link to entry on the Chrome Platform Status

https://chromestatus.com/feature/5178263526834176?gate=6555321377095680

Links to previous Intent discussions

Intent to Prototype: https://groups.google.com/a/chromium.org/d/msgid/blink-dev/8fad03d3-9a94-46bd-abbe-6da8ce433074n%40chromium.org

This intent message was generated by Chrome Platform Status.

[Mike Taylor]

Can we please request signals?

Web developers: No signals

Other signals:

WebView application risks

Does this intent deprecate or change behavior of existing APIs, such that it has potentially high risk for Android WebView-based applications?

No information provided

Debuggability

No information provided

Will this feature be supported on all six Blink platforms (Windows, Mac, Linux, ChromeOS, Android, and Android WebView)?

No

Say more?

--
You received this message because you are subscribed to the Google Groups "blink-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blink-dev+...@chromium.org.
To view this discussion visit https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAFmjHKQO5WSkhWocqeaJ7mWV65zzEYT27GCJmiEqjY-E9AwWpw%40mail.gmail.com.

[Sebastian Zartner]

Mozilla has already shipped support for text-decoration-inset in Firefox 146, see https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/146#css, though they are currently still working on support for percentages.

Safari also recently implemented it in https://bugs.webkit.org/show_bug.cgi?id=319178, see also https://webkit.org/css-status/?#property-text-decoration-inset. Though, as far as I could see, they are also currently lacking support for percentages, so I just filed https://bugs.webkit.org/show_bug.cgi?id=322441 for that.

Neither Apple nor Mozilla published standards positions for that feature, though.

Sebastian

[Helmut Januschka]

@sebastian, thanks for the input.

@mike, sorry it was my fault for sure it works on all blink platforms, i just messed up the checkbox, allthough i went through all fields multiple times - i'll do better next time :/ 

[Mike Taylor]

On 8/24/26 5:54 p.m., Helmut Januschka wrote:

@sebastian, thanks for the input.

Yes, thanks Sebastian! 

Helmut, do you mind updating the Chromestatus entry to reflected Shipped/Shipping, perhaps adding a Note about percentages?

@mike, sorry it was my fault for sure it works on all blink platforms, i just messed up the checkbox, allthough i went through all fields multiple times - i'll do better next time :/ 

No worries - very simple mistake, and easy to fix. :)

One question on WPTs: do we expect the failures at https://wpt.fyi/results/css/css-animations/text-decoration-inset-auto.html?

(I think the rest of the tests are at https://wpt.fyi/results/css/css-text-decor?label=master&label=experimental&aligned&q=text-decoration-inset - which looks good)

[Helmut Januschka]

@mike: feature entry updated and  the missing WPT is addressed as a follow up in in: https://chromium-review.googlesource.com/c/chromium/src/+/8277832 (in review) 

[Mike Taylor]

Thanks Helmut.

LGTM1 to ship, assuming we land animation support.

[Vladimir Levin]

LGTM2

[Chris Harrelson]

LGTM3, conditioned on landing animation support before shipping.

--

You received this message because you are subscribed to the Google Groups "blink-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blink-dev+...@chromium.org.

To view this discussion visit https://groups.google.com/a/chromium.org/d/msgid/blink-dev/f1821795-e9f8-4a22-bdb0-00a7b50b23ddn%40chromium.org.

[Helmut Januschka]

animation support has now landed:
https://chromium-review.googlesource.com/c/chromium/src/+/8277832

This implements the CSSWG resolution: auto remains auto, resolves to the UA-chosen length when interpolated with a length, and auto-to-auto remains auto. WPT coverage is included.

The remaining CSSWG work is to clarify the detailed animation and transition behavior in the specification:
https://github.com/w3c/csswg-drafts/issues/13036#issuecomment-5456514408

Chromium and Firefox currently behave consistently for these cases. With the animation CL landed, is everyone fine with proceeding to default-on it?

sorry that it took so long, and thanks for the guidance!

cheers

​

[Chris Harrelson]

Excellent, thank you Helmut!

To view this discussion visit https://groups.google.com/a/chromium.org/d/msgid/blink-dev/4ecefb1a-fa18-4a1d-9a79-7d73d975a3d0n%40chromium.org.

[Sebastian Zartner]

Thank you, Helmut!

I've now requested an async resolution on your proposed clarification of the spec regarding animation and transition behavior.

Sebastian

[Helmut Januschka]

spec has been cleard, landing flag-flip now! :)  thank you!