Peel Off Sticker Buttons

Examples


                    <button type="button" class="btn-sticker">Sticker Button</button>

Bootstrap 5 buttons

                
                    <button type="button" class="btn btn-sticker btn-sticker-corner-border-inherit btn-primary">Sticker Button</button>

Use .btn-sticker-corner-border-inherit class to copy corner border style from button.

The .btn-sticker-corner-dark class sets the corner background to dark style.

Bootstrap 5 outline buttons

Use .btn-sticker-corner-border-inherit-fill class to fill whole corner background with button border color.

Sticker corner angle

                    
                        // Sass variable

                        $sticker-corner-angle-variants: (0, 15, 30, 45, 135, 150, 165, 180, 195, 210, 225, 315, 330, 345);

Sizes

btn-sticker btn-sticker-lg

btn-sticker btn-sticker-sm

Static corner

btn-sticker btn-sticker-corner-static

Show corner on hover

btn-sticker btn-sticker-corner-hover

Bootstrap 5 Toggle states

                
                    <button type="button" class="btn btn-primary btn-sticker" data-bs-toggle="button" autocomplete="off">Toggle button</button>
                    
                    <button type="button" class="btn btn-primary btn-sticker active" data-bs-toggle="button" autocomplete="off" aria-pressed="true">Toggle button</button>