Skip to documentation
StardwstDESIGN SYSTEM

Documentation

Search pages and components

    Stardwst / Design system

    Stardwst
    design system

    CSS tokens and recipes, React components, and interface writing guidance for Stardwst.

    Start building Browse components

    Private workspace packages · CSS and React 19. APIs are under active design.

    The system in useLive example

    Create a project

    Example form

    Choose a name your team will recognize.

    This preview uses the Field, Checkbox, and Button recipes with native HTML.

    View example code
    <section class="stardwst">
  <form class="stack">
    <div class="field">
      <label class="label" for="project-name">Project name</label>
      <input
        class="input"
        id="project-name"
        aria-describedby="project-name-hint"
        name="project"
        required
      />
      <p class="helper" id="project-name-hint">Choose a name your team will recognize.</p>
    </div>

    <label class="checkbox filled">
      <input class="visually-hidden" name="updates" type="checkbox" />
      <span class="control" aria-hidden="true">
        <svg
          aria-hidden="true"
          class="indicator"
          fill="none"
          height="14"
          viewBox="0 0 24 24"
          width="14"
          stroke="currentColor"
          stroke-linecap="round"
          stroke-linejoin="round"
          stroke-width="2.5"
        >
          <path d="m5 12 4.2 4.2L19 6.8" />
        </svg>
      </span>
      <span class="label">Send me project updates</span>
    </label>

    <button class="button filled" type="submit">
      <span class="content">Create project</span>
    </button>
  </form>
</section>
    Semantic color Shared spacing Outlined theme

    Explore the system