Live
Run
Copied to Clipboard
<!DOCTYPE html> <html> <head> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"> </head> <body> <h1>bi bi-border-middle</h1> <i class='bi bi-border-middle'></i> <i class='bi bi-border-middle' style='font-size:24px'></i> <i class='bi bi-border-middle' style='font-size:36px;color:green'></i> <button class='custom-button'><i class='bi bi-border-middle'></i> border-middle</button> <style> .custom-button { padding: 10px 20px; font-size: 16px; font-weight: bold; cursor: pointer; border: none; border-radius: 5px; background-color: #ad6800; color: #fff; transition: background-color 0.3s ease; } .custom-button:hover { background-color: #874d00; } </style> </body> </html>