Skip to content

Custom Gradient Direction

The button has a default gradient direction of to bottom in dark mode, to top in light mode. You can change this value by using the following CSS custom properties:

descriptioncustom property
Gradient direction in light mode --o_gradient-direction-light
Gradient direction in dark mode --o_gradient-direction-dark
Gradient direction --o_gradient-direction
Custom gradient direction site wide
.o-btn {
--o_gradient-direction-light: to right;
--o_gradient-direction-dark: to left;
}
Custom gradient direction modifier class
.o-btn-fancy {
--o_gradient-direction-light: to right;
--o_gradient-direction-dark: to left;
}