background image
L"> Quote Card
background image
L"> Quote Card
background image
L"> 
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="src/output.css">
  <title>Quote Card</title>
</head>

<body class="bg-gray-500 dark:bg-gray-900 flex items-center justify-center min-h-screen">
  <div class="relative w-full max-w-xs bg-gray-800 rounded-lg shadow-lg overflow-hidden hover:text-gray-300">
    <div>
      <img src="<https://images.pexels.com/photos/4482837/pexels-photo-4482837.jpeg>" alt="background image"
        class="w-full h-48 object-cover opacity-50">
      <div class="absolute top-2 right-2 text-white">
        <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="<http://www.w3.org/2000/svg>">
          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
        </svg>
      </div>
    </div>
    <div>
      <div class=" bottom-0 p-4">
        <span class="text-gray-400 text-sm">Label</span>
        <p class="mt-2 text-white text-lg font-semibold">Success is not final, failure is not fatal: It is the courage
          to continue that counts.</p>
      </div>
    </div>

  </div>

</body>

</html>

enjoy!!