Re: [csswg-drafts] [css-logical][css-images] flow-relative gradients (#1724)

At the risk of either deepening or simplifying the 8 year old bikeshed, I believe there's a better solution.

What I want is to have a gradient direction that is transformed relative to the text flow direction. Not a gradient that points _in_ the text flow direction.

Gradient directions are not the same as flow directions. A flow direction is discrete, whereas gradient directions are continuous.

Let's say that my gradient is pointing at 31 degrees when in horizontal ltr tb layout (→↓). In horizontal **rtl** tb layout (←↓) I want to flip the x coordinate of that 31 degrees, in other words applying the transformation `- θ`. So the gradient would render at -31 ≡ 329 degrees. Other flow directions correspond to other linear transformations of the angle.

So for the syntax, can we not just have `linear-gradient(ltr ...` where "ltr" means "Hey I'm a gradient that was designed for horizontal ltr tb flow but in other flows the angle should be adjusted accordingly so that it follows the text flow". That syntax would then allow things like `linear-gradient(ltr 31deg, ...)`, or `linear-gradient(ltr var(--some-angle), ...)`, etc. I don't believe that `linear-gradient(ltr to right` is much more clunky than `linear-gradient(to inline-end` but it's certainly way more general.

This mirrors the syntax of `image(ltr ...)` as mentioned above. It also means that if you already have a gradient, all you need to do is add "ltr " at the front and it will automatically be updated to work in different flow directions.

I know that it's against the grain to _not_ use logical keywords, but there's no need to introduce inline/block start/end keywords here because they are simultaneously more complicated to use, while also being insufficient to solve the problem.

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


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

Received on Monday, 8 September 2025 16:00:01 UTC