Skip to Content
Introduction

GG Software Design System

Documentation for the @gg-software/* packages — a React design system and helper libraries for building customer-facing websites with admin panels / CMS.

Activedesign-system

Packages

PackagePurposeStatus
@gg-software/uiPresentational React components + design tokens & theming. Knows nothing about your data.✅ 91 components
@gg-software/utilsPure, framework-agnostic helpers. No React.🚧 growing
@gg-software/authAuth / session / permission logic: JWT helpers, session storage, RBAC + React guards.✅ complete
@gg-software/cmsOpinionated admin-panel building blocks composed from ui + utils + auth.📋 planned

How these docs work

  • Every component page documents every prop: name, type, default and description. The prop tables are generated from the TypeScript source on every build, so they can never drift from the code.
  • Live previews render the real components right on the page, followed by the copy-pasteable code that produced them.
  • AI agents can consume the whole site as plain markdown — see For AI Agents.

Quick start

pnpm add @gg-software/ui react react-dom
import { Button } from '@gg-software/ui';
import '@gg-software/ui/styles.css';
 
export function App() {
    return <Button variant="primary">Hello</Button>;
}

Continue with Getting Started.

Getting Started