जनरेट बटन

781 alejandrokundrah

संपादक में खोलें अपना कोड प्रकाशित करें

अनुशंसित

14 October 2024

भुगतान फार्म

28 August 2025

टेलविंड सीएसएस के साथ वास्तुकला और डिज़ाइन वेबसाइट

18 October 2024

HTML CSS पोर्टफोलियो वेबसाइट टेम्पलेट

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Neumorphic Generate Button</title>
    <style>
        body {
            background-color: #E0E5EC;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
        }

.button {
            width: 200px;
            height: 60px;
            border-radius: 30px;
            background-color: #E0E5EC;
            box-shadow:  9px 9px 16px #A3B1C6,
                         -9px -9px 16px #FFFFFF;
            display: flex;
            justify-content: center;
            align-items: center;
            font-family: sans-serif;
            font-weight: bold;
            color: #707070;
            cursor: pointer;
            user-select: none;
        }

.button:active {
             box-shadow: inset 9px 9px 16px #A3B1C6,
                         inset -9px -9px 16px #FFFFFF;
        }
    </style>
</head>
<body>
    <div class="button">Generate</div>
</body>
    <script src="script.js>
       
    </script>
    
</html>

अनुशंसित

भुगतान फार्म

टेलविंड सीएसएस के साथ वास्तुकला और डिज़ाइन वेबसाइट

HTML CSS पोर्टफोलियो वेबसाइट टेम्पलेट

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS