Link Button

Wrap a link in linkbutton markers to render it as a styled button. On GitHub it’s a plain link. In Starlight it’s a button with variant coloring.

Basic usage

Get Started

View Markdown source

/linkbutton

<!-- linkbutton -->
[Get Started](/components/)

Variants

Primary Secondary Minimal

View Markdown source

/linkbutton

<!-- linkbutton variant:primary -->
[Primary](/components/)
<!-- linkbutton variant:secondary -->
[Secondary](/components/)
<!-- /linkbutton -->

<!-- linkbutton variant:minimal -->
[Minimal](/components/)
<!-- /linkbutton -->

With icon

Get Started View on GitHub

View Markdown source

/linkbutton

<!-- linkbutton variant:primary icon:right-arrow -->
[Get Started](/components/)
<!-- linkbutton variant:secondary icon:external icon-placement:start -->
[View on GitHub](https://github.com/claylo/rehype-gfm-components)
<!-- /linkbutton -->

How it renders

Context	Rendering
GitHub	Plain link
Starlight	Styled button with variant coloring and optional icon

Parameters

Parameter	Values	Default	Description
variant	primary, secondary, minimal	primary	Button style variant
icon	Starlight icon name	none	Icon to display alongside the label
icon-placement	start, end	end	Icon position relative to the label

HTML output

<a href="/path" class="sl-link-button not-content primary">
  Get Started
</a>