Animated Gradient Text

<style>
  @keyframes gradient-pan { to { background-position: 200% center; } }
  .gradient-text {
    background-image: linear-gradient(90deg, #6366f1, #ec4899, #f59e0b, #6366f1);
    background-size: 200% auto;
    animation: gradient-pan 6s linear infinite;
  }
  @media (prefers-reduced-motion: reduce) {
    .gradient-text { animation: none; background-position: 0 center; }
  }
</style>

<span class="gradient-text inline-block bg-clip-text text-4xl font-bold text-transparent">
  Ship something beautiful
</span>