tailwindcss

mirror of https://github.com/tailwindlabs/tailwindcss.git synced 2025-12-08 21:36:08 +00:00

Go to file

Support specifying gradient interpolation method via modifier (#14984 )

This PR adds support for specifying a color interpolation method for all
gradient utilities using a modifier:

```html
<div class="bg-linear-to-r/oklab">
```

Supported bare values are any valid color space keyword, as well as the
special keywords `shorter`, `longer`, `increasing`, and `decreasing`,
which are shortcuts for `in oklch {keyword} hue`.

Arbitrary values are also supported and are used as-is, so the `in`
keyword is not automatically included for you:

```html
<div class="bg-linear-to-r/[in_oklab]">
```

Modifiers are not supported when using arbitrary values for the actual
gradient, as it's expected that your arbitrary gradient value contain
all of the details you want in your gradient:


```html
<!-- Won't work -->
<div class="bg-linear-[to_right]/oklab">

<!-- Do this -->
<div class="bg-linear-[to_right_in_oklab]">
```

Resolves https://github.com/tailwindlabs/tailwindcss/issues/14955, but
it may still be wise to make `oklab` the default since I do sort of
agree with the poster there that most people probably expect a gradient
between two colors to sort of just "fade" between them rather than
interpolate between them around the color wheel.

---------

Co-authored-by: Adam Wathan <4323180+adamwathan@users.noreply.github.com>

2024-11-13 10:18:59 -05:00

.github

Add CODEOWNERS file (#14701 )

2024-10-17 09:05:44 -04:00

crates

Prepare v4.0.0-alpha.33 release (#14967 )

2024-11-11 20:28:41 -05:00

integrations

Remove input borders by default (#14929 )

2024-11-08 15:29:41 -05:00

packages

Support specifying gradient interpolation method via modifier (#14984 )