PatternFly · @patternfly/react-core

Button

Rendered server-side by Astro (no client JS). Use `component="a"` for links.

Import: import { Button } from '@patternfly/react-core'
Use on: landing · tools · docs
Upstream docs: www.patternfly.org/components/button

PatternFly’s Button, rendered by Astro on the server. Static pages get the markup and CSS only. For a link that looks like a button use component="a". Prefer primary once per view.

Variants

Link Large link

Code

import { Button } from '@patternfly/react-core';
<Button variant="primary">Primary</Button>
<Button variant="secondary">Secondary</Button>
<Button variant="tertiary">Tertiary</Button>
<Button variant="link" component="a" href="/reports/">Link</Button>
<Button variant="primary" size="lg" component="a" href="/reports/">Large link</Button>