Ribbons

  1. Home
  2. UI
  3. Ribbons

Ribbons default

Add class: .ribbon. It must be inside .ribbon-wrapper class. Content should be inside .ribbon-content class.
Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

For colors, add: .bg-secondary, .bg-primary, .bg-info, .bg-success, .bg-danger, .bg-warning, .bg-custom

Ribbons right align

Add class: .ribbon-right
Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Vertical ribbons

Add class: .ribbon-vertical-l to display on left. Add class: .ribbon-vertical-r to display on right.

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Bookmarked ribbons

Add class: .ribbon-bookmark right after the .ribbon class.
Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Ribbon

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Duis mollis, est non commodo luctus, nisi erat porttitor ligula

Duis mollis, est non commodo luctus, nisi erat porttitor ligula