Illustrations Small composition-based illustrations used to represent artifact types — documents, presentations, sheets, spreadsheets, screenings, and HTML outputs.

Usage

Import illustrations from the UI package. Click any illustration below to copy its name.

import { PresentationIllustration } from "@rogo-technologies/ui/illustrations";

Each illustration accepts className and style props and renders inside a fixed 56×40 frame.

Adding a new illustration

Illustrations live in packages/ui/src/illustrations/. They're authored as React components built from divs and Tailwind utility classes (not SVGs) so they inherit theme tokens like bg-primary and bg-tertiary. Export new illustrations from the folder's index.ts to make them available to consumers.

Gallery