Brave Components
Our Works Here
Buttons
Use the class btn btn-XXX
(XXX = color name).
Button Extra Small
Button Small
Button Large
Outline Buttons
Use the class btn-outline
.
Transparent Button
Use the class btn-transparent
.
Round Button
Use the class btn-round
.
Round Button with Icon
Use the class btn-round
and add font awesome icon.
Disabled Button
Use the attribute disabled="disabled"
.
Badge & Label
Badges
Use the class badge badge-XXX
(XXX = color).
Label
Use the class label label-XXX
(XXX = color).
Label Extra Small
Use the class label label-xs label-XXX
(XXX = color).
Label Small
Use the class label label-sm label-XXX
(XXX = color).
Label Large
Use the class label label-lg label-XXX
(XXX = color).
Text Colors
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque.
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque.
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque.
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque.
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque.
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque.
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque.
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque.
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque.
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque.
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque.
Background Color
Use the class bg-XXX
(XXX = color).
White Background
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos.
Grey Background
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos.
Black Background
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos.
Red Background
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos.
Green Background
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos.
Light Blue Background
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos.
Blue Background
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos.
Orange Background
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos.
Yellow Background
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos.
Rose Background
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos.
Purple Background
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos.
Brown Background
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos.
Border Color
Use the class br-XXX
(XXX = color).
White Background
At vero eos et accusamus deleniti atque corrupti quos.
Grey Background
At vero eos et accusamus deleniti atque corrupti quos.
Black Background
At vero eos et accusamus deleniti atque corrupti quos.
Red Background
At vero eos et accusamus deleniti atque corrupti quos.
Green Background
At vero eos et accusamus deleniti atque corrupti quos.
Light Blue Background
At vero eos et accusamus deleniti atque corrupti quos.
Blue Background
At vero eos et accusamus deleniti atque corrupti quos.
Orange Background
At vero eos et accusamus deleniti atque corrupti quos.
Yellow Background
At vero eos et accusamus deleniti atque corrupti quos.
Rose Background
At vero eos et accusamus deleniti atque corrupti quos.
Purple Background
At vero eos et accusamus deleniti atque corrupti quos.
Brown Background
At vero eos et accusamus deleniti atque corrupti quos.
Border Size
Use the class br-XXX br-size-YYY
(XXX = color) & (YYY = Number 1 to 5).
Border Style
Use the class br-XXX br-style-YYY
(XXX = color) & (YYY = Number 1 to 3).
Border Radius
Use the class rounded-XXX
(XXX = Number 1 to 5).
Shapes
Square
Use class square-XXX
(XXX = Number 1 to 5).
1
2
3
4
5
Circle
Use class circle-XXX
(XXX = Number 1 to 5).
1
2
3
4
5
Social Media
Follow the below syntax for social media buttons of different styles.