Step 1) Add HTML: Step 2) Add CSS: the code is! < button class="btn success" > Success < /button> < button class="btn info" > Info < /button> < button class="btn warning" > Warning < /button> < button class="btn danger" > Danger < /button> < button class="btn default" > Default < /button> .btn { border: none; /* Remove borders */ color: white; /* Add a text color */ padding: 14px 28px; /* Add some padding */ cursor: pointer; /* Add a pointer cursor on mouse-over */ } .success { background-color: #04AA6D; } /* Green */ .success:hover { background-color: #46a049; } .info { background-color: #2196F3; } /* Blue */ .info:hover { background: #0b7dda; } .warning { background-color: #ff9800; } /* Orange */ .warning:hover { background: #e68a00; } .danger { background-color: #f44336; } /* Red */ .danger:hover { background: #da190b; } .default { background-color: #e7e7e7; color: black; } /* Gray */ .default:hover { background: #ddd; }