Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!doctype html>
<html>
    <head>
        <title>Nice looking buttons</title>
        
        <style type="text/css">
            button {
                color: #404040;
                background-color: #EAEAEA;
                border: 2px solid #E2E2E2;
                border-bottom: 3px solid #E2E2E2;
                border-radius: 5px;
                height: 33px;
                margin: 5px;
                font-size: 0.8em;
            }
            
            button:hover, button:focus {
                background-color: #E3E3E3;
                border-bottom: 3px solid #D2D2D2;
                border: 2px solid #D2D2D2;
                outline: none;
            }
            
            button:active {
                background-color: #EAEAEA;
                border-bottom: 5px solid #E2E2E2;
                border: 2px solid #E2E2E2;
            }
        </style>
    </head>
    
    <body>
        <button>Click me!</button>
        <br />
        <button>Do I look nice?</button>
        <br />
        <button>Submit</button>
    </body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
Alexander-Zaepro
0viewers