STAQUI FIELD GUIDE

Documentation

Set up StaqUI, make it fit your product, and find the components and patterns you need.

Install StaqUI

Set up the package and render your first component.

Guides

Themes & tokens

Make the system yours with semantic colors, typography, and spacing.

Accessibility

Understand keyboard behavior, labels, focus, and application testing.

Design language

Get to know the rhythm, geometry, and principles behind StaqUI.

Component inventory

Explore the full system and the implementation details of each piece.

Deploy the docs

Build and host this documentation from the workspace.

THE SHAPE OF THINGS

Explore the components

Try the live examples, inspect component props, and copy the source for React or HTML.

Open the component reference

App.tsx

import { StaqProvider, Button }
  from "@staqforce-studio/staqui";
import "@staqforce-studio/staqui/styles.css";

export default function App() {
  return (
    <StaqProvider theme="light">
      <Button variant="primary">Let’s build</Button>
    </StaqProvider>
  );
}