Tuesday, 19 March 2024

Buttons Styles

  • Category: Typography
  • Written by Super User
  • Hits: 10371

This page present demo content with red buttons, green buttons and all kinds of buttons!

Orange Buttons

Big Rectangle Rounded Medium Default Small Span

Red Buttons

Big Rectangle Rounded Medium Default Small Span

Pink Buttons

Big Rectangle Rounded Medium Default Small Span

Mint Buttons

Big Rectangle Rounded Medium Default Small Span

Blue Buttons

Big Rectangle Rounded Medium Default Small Span

White/Black Buttons - Template Default

Big Rectangle Rounded Medium Default Small Span

Gray Buttons

Big Rectangle Rounded Medium Default Small Span

Black Buttons

Big Rectangle Rounded Medium Default Small Span

Usage

White Color - default
<a href="#" class="button big">Big Rectangle</a>
<a href="#" class="button bigrounded">Rounded</a>
<a href="#" class="button medium">Medium</a> 
<a href="#" class="button">Default</a>
<a href="#" class="button small">Small</a>
<input class="button" value="Input Element" type="button"> 
<span class="button">Span</span>
Orange Color Example - for other colors just find & replace color name
<a href="#" class="button orange big">Big Rectangle</a> 
<a href="#" class="button orange bigrounded">Rounded</a> 
<a href="#" class="button orange medium">Medium</a> 
<a href="#" class="button orange">Default</a>
<a href="#" class="button orange small">Small</a>
<input class="button orange" value="Input Element" type="button"> 
<span class="button orange">Span</span>