from-/via-/to- stops for gradients in any palette.

Syntax#

html
<div class="bg-gradient-to-r from-cyan-400 to-blue-600 h-16"></div>

All palettes apply#

Every palette in the colors/index|color system generates a from-* class: the theme palettes of your chosen preset…

Patterns#

  • Buttons: from-blue-500 to-indigo-600
  • Text: bg-clip-text + transparent
  • Keep gradients ≤3 stops

colors/index|Color hub · concepts/dark-mode-strategies|Dark mode · accessibility/color-contrast|Contrast