Button Link component sample

This page shows every option of the Button Link component (CGIAR-155). Each section below is labelled with the settings used.

Variants

Variant: Primary, Secondary, Tertiary, Global. Colours adapt to the section theme.

Variants on dark section

Variant: Primary, Secondary, Tertiary, Global. Colours adapt to the section theme.

Size and width

Size: Big or Small. Width: Auto fits the label, Full width fills the content column.

Size and width

Size: Big or Small. Width: Auto fits the label, Full width fills the content column.

Icons and new tab

Default uses the arrow, or the external-link icon when the link opens in a new tab.

Inside a grid

In a grid cell the button uses the cell width, not the page column.

Inside an accordion

The button matches the accordion text width.

Inside an accordion