SOURCE

console 命令行工具 X clear 

                    

                        
>

                        
                    

                

            

            
console

            
<body class="mid">
    <button class="x-button">THE BUTTON</button>
</body>

            
@import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');
* {
    padding: 0;
    margin: 0;
}

body {
    width: 100vw;
    height: 100vh;
    background: #fff;
}

.mid {
    display: flex;
}

.mid * {
    margin: auto;
}

.x-button {
    font-family: "Poppins";
    min-width: 70px;
    padding: 10px;
    border-radius: 10px;
    background: transparent;
    border: 1px solid rgba(26, 115, 232, .32);
    outline: 3px solid transparent;
    transition: .5s
}

.x-button:hover {
    color: #555;
    background: rgba(26, 115, 232, .12);
}

.x-button:active {
    color: #fff;
    background: rgba(26, 115, 232, .52)
}

.x-button:focus {
    border: 1px solid transparent;
    outline: 3px solid rgba(26, 115, 232, .12);
}