Medium Size
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna.
Medium Button
Large Size
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor ncididunt ut labore et dolore magna.
Large Button
Extra Large
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.
Extra Large
Stylish Button Shapes
5 Different Shapes
Bravio Buttons are truly made with love, giving you tons of options to make stylish buttons according to latest web trends with pure CSS.
They are cross browser and look awesome on all major browsers.
They are cross browser and look awesome on all major browsers.
Flat Button
Round Button
Pill Button
Shield Button
Skew Button
Cool 3D Buttons
3D Flat Button
3D Round Button
3D Pill Button
3D Shield Button
3D Skew Button
Gradient 3D Buttons
Gradient 1
Gradient 2
3D Buttons – Border Enabled
3D Flat Button
3D Round
3D Pill Button
3D Shield Button
3D Buttons – Mouse Roll Over Effect
3D Skew Button
Gradient 1
Gradient 2
Buy Bravio
Border Size
Border can be set to any type of button. If you set border e.g. border=“1″ the inset (semi transparent top white border) is automatically enabled, turn it off by setting inset=“0″.
NO Border
1px Border
2px Border
3px Border
Any Shape / Size
Border can be applied to all available sizes and shapes without any limit.
1px Border
1px Border
HOVER Shadows Effect
You can apply this effect to any currently available shapes i.e. Flat, Round, Pill, Shield and Skew.
Drop Shadow
Grow Shadow
Outset Shadow
Inset Shadow
Inset Border & Color
By default inset border is ON if border is set but can be disabled by setting inset=“0″, you can also modify the color of inset border (top white border) by adding a custom color in hex format e.g. inset=“#990000″.
Inset ON
Inset OFF
Inset COLOR
Left / Right Padding & Margins
You can set custom left / right padding for example if you choose „medium“ button but want to have custom width then set e.g. lrpadding=“50″. Margin to right can be set with marginright variable e.g. marginright=“10″.
Default Padding
Custom Padding
Text Shadows
Adding a text shadow in buttons makes it more appealing. We have provided an option to turn text shadow ON / OFF. By default text shadow is disabled, however by setting „textshdow“ variable to 1 enables text shadow.
Hide Text Shadow
Show Text Shadow
Icon Active and Over Colors
If you dont set any icon color, it will use the textcolor value, however setting „iconcolor“ and „iconovercolor“ will change the icon color.
Icon Active Color
Icon Mouseover Color
Both Colors
Background Transparency
You can set background transparency with combination of any styles.
Get in Touch
Get a Free Quote
Call Back Request
Buy Bravio
HOVER 2D Transition Effects
Bravio buttons tons of has built in hover effects to choose from, below are examples of 2D transition hover effects. Set hover=“effectname“ and you are all set.
Grow
Shrink
Pulse
Pulse & Grow
Pulse & Shrink
Push
Pop
Rotate
Rotate & Grow
Float
Sink
Bob
Hang
Skew
Skew Forward
Skew Backward
Wobble Horizontal
Wobble Vertical
Wobble to Bottom Right
Wobble to Top Right
Wobble Top
Wobble Bottom
Wobble Skew
Buzz
Buzz Out
HOVER Background Transition Effects
Bravio buttons tons of has built in hover effects to choose from, below are examples of background transition hover effects. Set hover=“effectname“ and you are all set.
Sweep Right
Sweep Left
Sweep Bottom
Sweep Top
Bounce Right
Bounce Left
Bou. Bottom
Bounce Top
Radial
Rectangle
Shutter Horizontal
Shutter Vertical
HOVER Round Shape Effect
You can apply this effect to any currently available shapes i.e. Flat, Round, Pill, Shield and Skew.
Flat
Round
Pill Button
Shield
Skew Button
Scalable Multipurpose Theme
Improve quality of your website by using its powerful features.
