# .gui (dotgui)

> .gui is an open, text-based file format for user interfaces — what .svg is to
> graphics, .gui is to UI. A .gui file is a zip package: design.guix (plain XML
> markup carrying frames, stacks, text, images, shapes, design tokens, fonts,
> and effects), an assets/ folder, and a preview.webp thumbnail. AI agents can
> read and write it directly; a deterministic, zero-AI toolchain validates,
> lints, scores, and renders it; any browser or design tool can display it.

Key facts:
- Only validation is required to produce a file; render and score are optional.
- A closed 53-role vocabulary (role="button", role="nav-bar", …) makes files self-describing.
- Quality is scored on CCAC (Clean, Consistent, Accessible, Comprehensible) — local, offline, zero-AI.
- The format, engine, CLI, and embed library are open source and free.

## Documentation

- [Full spec and toolchain docs](https://dotgui.org/llms-full.txt): everything below concatenated as one markdown file
- [Spec Reference](https://dotgui.org/spec): every element, attribute, and token type
- [Role vocabulary](https://dotgui.org/spec/roles): the 53 recognized UI roles
- [Quality model](https://dotgui.org/spec/quality): the CCAC scoring spec

## Toolchain

- [gui CLI](https://dotgui.org/cli): read, write, lint, render, and package .gui files; `gui setup` installs the dotgui skill into AI agents
- [@dotgui/kit](https://dotgui.org/kit): the reference engine — parser, validator, renderer, scorer in one deterministic package
- [@dotgui/embed](https://dotgui.org/embed): render .gui files on any website with one CDN script
- [Figma plugin](https://dotgui.org/figma): export any Figma layer as a .gui file

## Optional

- [Playground](https://dotgui.org/playground): write .gui XML and see it render live