WEBLEB
होम
संपादक
लॉग इन करें
Pro
हिंदी
English
Français
Español
Português
Deutsch
Italiano
हिंदी
सीएसएस ग्रेडिएंट बटन
1409
securearray494
संपादक में खोलें
अपना कोड प्रकाशित करें
अनुशंसित
25 August 2024
सीएसएस 3डी सौर प्रणाली
9 August 2023
सीएसएस सोशल आइकन्स टॉग्लर
8 July 2025
पूर्वावलोकन कार्ड एनीमेशन (सीएसएस स्प्राइट्स) के साथ चरित्र चयन
HTML
Copy
<!DOCTYPE html> <html lang="en"> <body> <button> <span class="text">Button</span> </button> </body> </html>
CSS
Copy
body{ display:flex; align-items:center; justify-content:center; height:100vh } button { display: flex; align-items: center; justify-content: center; padding: 20px; min-width: 140px; max-width: 100%; border: 0; border-radius: 8px; background-image: linear-gradient(144deg, #4caf50, #2196f3 50%, #ff9800); color: #fff; font-size: 18px; line-height: 1; box-shadow: rgba(0, 0, 0, 0.2) 0 10px 20px -5px; cursor: pointer; transition: transform 0.3s, background-color 0.3s; user-select: none; white-space: nowrap; box-sizing: border-box; touch-action: manipulation; } button:hover { background-image: linear-gradient(144deg, #81c784, #64b5f6 50%, #ffcc
JS
Copy
/* Replace with your JS Code (Leave empty if not needed) */
