Properties#
| Prop |
Type |
Default |
Description |
title |
string |
required |
The label shown on the button. |
href |
string |
required |
The URL the button links to. |
icon |
string |
— |
Icon shown before the label. Accepts a built-in icon key (Phosphor or Simple Icons) or a custom URL. |
variant |
'primary' 'secondary' |
primary |
Visual style of the button. |
target |
'_blank' '_self' |
_blank |
Where the link opens. _blank adds rel="noopener noreferrer" automatically. |
Examples#
View Documentation
<scalar-button
title="View Documentation"
href="https://docs.scalar.com">
</scalar-button>
<Button
title="View Documentation"
href="https://docs.scalar.com"
/>
Download SDK
<scalar-button
title="Download SDK"
href="https://github.com/scalar/scalar"
icon="phosphor/regular/download">
</scalar-button>
<Button
title="Download SDK"
href="https://github.com/scalar/scalar"
icon="phosphor/regular/download"
/>
Secondary Variant#
Learn More
<scalar-button
title="Learn More"
href="https://scalar.com"
variant="secondary">
</scalar-button>
<Button
title="Learn More"
href="https://scalar.com"
variant="secondary"
/>
