Standard

Theming supports multiple button styles that can be used to indicate the purpose or importance of a button. The available styles are: primary, secondary, danger, success, warning, and info. Each style has its own visual appearance, which can be defined in the theme's CSS. By using different styles, you can create a visual hierarchy and guide users' attention to important actions or information on your website. Additionally, theme can provide more styles for buttons. Usually additional styles either available via non-standard value for the style parameter(e.g., style="outline-primary"), or via standard style combined with non-standard attribute variant(e.g., style="primary", variant="outline")

{%- call ui.util.call(show_example) -%} {%- raw %} {{ ui.button("Default") }} {{ ui.button("Primary", style="primary") }} {{ ui.button("Secondary", style="secondary") }} {{ ui.button("Danger", style="danger") }} {{ ui.button("Success", style="success") }} {{ ui.button("Warning", style="warning") }} {{ ui.button("Info", style="info") }} {%- endraw %} {%- endcall %}