WEBLEB
होम
संपादक
लॉग इन करें
Pro
हिंदी
English
Français
Español
Português
Deutsch
Italiano
हिंदी
HTML
CSS
JS
<!DOCTYPE html> <html lang="en"> <body> <button> <span class="text">Button</span> </button> </body> </html>
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
/* Replace with your JS Code (Leave empty if not needed) */
Validating your code, please wait...
HTML
CSS
JS
<!DOCTYPE html> <html lang="en"> <body> <button> <span class="text">Button</span> </button> </body> </html>
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
/* Replace with your JS Code (Leave empty if not needed) */