Semantic UI Spec
Semantic is a set of standards designed to make front end development less arbitrary. This is the definition of a button.
Button
The standard button:
Button
States
Can be hovered:
Hovered Button
Can be pressed in:
Pressed Button
Can be active:
Active Button
Can be disabled:
Disabled Button
Can show a loading indicator:
Loading Button
Can show a toggled state:
Toggled Button
Can alert to a succesful action:
Succesful Button
Can alert user of an error:
Succesful Button
Standard Variations
Can have different sizes:
Mini
Tiny
Small
Medium
Big
Huge
Massive
Gigantic
Can have different colors:
Blue Button
Purple Button
Green Button
Can fit parent container:
Fits container
Buttons (Button Groups)
Can exist together as groups
Variations can modify groups
Blue
Large
Additional Variations
Can be formatted to fit just an icon or image:
Can be attached to the top or bottom of other content
Top
Bottom
Can be attached to an input field
Search
States
Button States
Normal
Hover
Down
Loading
Disabled
Active
Toggled
Error
Success