Using daisyUI from- and to- colours for Tailwind Background Clip

[spences10]

Hi,

I'm trying to use daisyUI colours in the Tailwind bg-clip-text class, here's the Tailwind example:

<div class="text-5xl font-extrabold ...">
  <span class="bg-clip-text text-transparent bg-gradient-to-r from-pink-500 to-violet-500">
    Hello world
  </span>
</div>

I want to use the daisyUI text-primary-content and text-secondary-content in here, or something similar, like this:

<div class="text-5xl font-extrabold ...">
  <span class="bg-clip-text text-transparent bg-gradient-to-r from-text-primary-content to-text-secondary-content">
    Hello world
  </span>
</div>

I can do it with CSS Variables: from-[var(--primary)] to-[var(--secondary)] but would like to use the built in daisyUI one if posible.

Thanks

[saadeghi]

Here's an example: https://play.tailwindcss.com/HPfZEywPIX

<div class="text-5xl font-extrabold">
  <span class="bg-clip-text text-transparent bg-gradient-to-r from-primary to-secondary">
    Hello world
  </span>
</div>

from- utility class only takes the color name. And primary is the purple (default theme) color. primary-content is the white color for the content to be used on primary color.
so you should be using from-primary instead of from-text-primary-content
and to-secondary instead of to-text-secondary-content

[spences10]

Awesome! Thanks @saadeghi 🙏