CORK Admin Template - Buttons UI Kit

Apply .btn class to give default styling.

.btn-primary

.btn-outline-primary

<button class="btn btn-primary mb-2">Primary</button>

<button class="btn btn-outline-primary mb-2">Primary</button>

Use .btn-rounded to make buttons rounded.

<button class="btn btn-primary btn-rounded mb-2">Primary</button>

<button class="btn btn-outline-primary btn-rounded mb-2">Primary</button>

Apply .btn-* class followed by .btn class to create default buttons.

<!-- Primary -->
<button class="btn btn-primary mb-2">Primary</button>

<!-- Info -->
<button class="btn btn-info mb-2">Info</button>

<!-- Success -->
<button class="btn btn-success mb-2">Success</button>

<!-- Warning -->
<button class="btn btn-warning mb-2">Warning</button>

<!-- Danger -->
<button class="btn btn-danger mb-2">Danger</button>

<!-- Secondary -->
<button class="btn btn-secondary mb-2">Secondary</button>

<!-- Dark -->
<button class="btn btn-dark mb-2">Dark</button>

Apply .btn-outline-* class followed by .btn class to create outline buttons.

<!-- Primary -->
<button class="btn btn-outline-primary mb-2">Primary</button>

<!-- Info -->
<button class="btn btn-outline-info mb-2">Info</button>

<!-- Success -->
<button class="btn btn-outline-success mb-2">Success</button>

<!-- Warning -->
<button class="btn btn-outline-warning mb-2">Warning</button>

<!-- Danger -->
<button class="btn btn-outline-danger mb-2">Danger</button>

<!-- Secondary -->
<button class="btn btn-outline-secondary mb-2">Secondary</button>

<!-- Dark -->
<button class="btn btn-outline-dark mb-2">Dark</button>

<button class="btn btn-primary mb-4 mr-2 btn-lg">Large button</button>

<button class="btn btn-secondary mb-4 mr-2">Default button</button>

<button class="btn btn-warning mb-4 mr-2 btn-sm">Small button</button>

<button class="btn btn-dark mb-4 mr-2 btn-sm disabled">Disabled Button</button>

<button class="btn btn-primary mb-2 mr-2"><svg> ... </svg> Left</button>

<button class="btn btn-warning mb-2 mr-2 btn-rounded">Right <svg> ... </svg></button>

<button class="btn btn-danger mb-2 mr-2"><svg> ... </svg></button>

<button class="btn btn-dark mb-2 mr-2 rounded-circle"><svg> ... </svg></button>

Link

<button class="btn btn-primary btn-block mb-4 mr-2">Button</button>

<input type="submit" class="btn btn-info btn-block mb-4 mr-2" value="Input">

<a href="javascript:void(0);" class="btn btn-success btn-block mb-4 mr-2">Link</a>

Alan Green

Lead Developer

My Profile

Inbox

#002658 is generated for Laurie Fox

#0036489 is generated for Ernest Reeves

#014778 is generated for Sean Freeman

#0165987 is generated for Nia Hillyer

#0265998 is generated for Dale Butler

Launch New Seo Wordpress Theme has been moved to Completed Board by Alma Clark

New Task is added by Ernest Reeves

Dinner with Kelly Young has been moved to Completed Board by Dale Butler

Buttons

Default

Rounded

Solid

Outline

Button Sizes

Button with Icons

Block Buttons

Alan Green

Todo

Messages

Andy King

Alma Clark

Vincent

Iris Hofman

Linda Nelson

New Invoice

Task Board

Event Notifications