<!DOCTYPE html>
<html lang="tr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Konforlu Ulaşım Butonu</title>
    <!-- Tailwind CSS kütüphanesi eklendi -->
    <script src="https://cdn.tailwindcss.com"></script>
</head>
<!-- Arka plan rengini görseldeki gibi mavi tonda ayarladım, sen kendi projene göre kaldırabilirsin -->
<body class="bg-[#3b79d6] min-h-screen flex items-center justify-center p-4">
    <!-- Ana Kutu (Beyaz arka plan, yuvarlak köşeler ve gölge) -->
    <div class="bg-white rounded-[2rem] shadow-md flex items-center px-6 py-3 gap-3 cursor-pointer hover:shadow-lg transition-shadow duration-300">
        
        <!-- Onay İkonu (Mavi Daire İçinde Beyaz Tik) -->
        <svg class="w-[32px] h-[32px] text-[#2c5b96]" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
            <path d="M12 2C6.48 2 2 6.48 2 12C2 17.52 6.48 22 12 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 12 2ZM10 17L5 12L6.41 10.59L10 14.17L17.59 6.58L19 8L10 17Z"/>
        </svg>
        <!-- Metin Kısmı -->
        <span class="text-[#2c5b96] font-[900] text-[22px] tracking-tight font-sans">
            Konforlu Ulaşım
        </span>
        
    </div>
</body>
</html>
bu işine yarar mı hocam
..gemini..