Using with AI
The kit publishes a machine-readable reference at /llms.txt. Point your coding assistant at it and it writes real kit markup instead of guessing at class names.
What it is
An assistant asked to “build a dashboard with 78 UI Kit” has two options: guess, or read
something. Left to guess it produces markup that looks plausible and is wrong —
_78-button instead of _78-btn, a stat card missing the element the
sparkline actually renders into, a theme override that sets --accent and leaves every
hover on the old color.
So the kit ships a reference written for that reader: plain Markdown, the complete public API, no navigation to crawl and no HTML to strip. Two files, both served from this domain.
| File | What is in it | Reach for it when |
|---|---|---|
/llms.txt |
A short index — what the kit is, install, the naming rules, the token names, and one line per component. | You want the assistant oriented without spending much of its context. |
/llms-full.txt |
The complete reference — every component with all of its classes, variants,
data-* attributes and JS options, plus the adapters and the generator API. |
It is actually writing code. This is the one to use for real work. |
llms.txt is a small proposed standard for publishing a site's content in a form a
language model can read directly — see
llmstxt.org. The kit follows it
because an assistant that already knows the convention will look for the file without being told.
The URLs
The two on this site always describe the release this site is built against:
https://78uikit.com/llms.txt
https://78uikit.com/llms-full.txt
They are a proxy of the kit repository's own copies, not a duplicate kept in step by hand, so they
cannot drift from the kit. Right now they serve
v0.4.0.
Match the version your project pins
If your project pins an older release, the reference on this site may describe classes that release does not have. Every tag carries its own copy on the CDN, so name the version you are actually using and the assistant reads exactly that API:
https://cdn.jsdelivr.net/gh/1978io/78UIKit@<version>/llms.txt
https://cdn.jsdelivr.net/gh/1978io/78UIKit@<version>/llms-full.txt
https://cdn.jsdelivr.net/gh/1978io/78UIKit@v0.4.0/llms-full.txt # this site's release
https://cdn.jsdelivr.net/gh/1978io/78UIKit@main/llms-full.txt # the latest, unpinned
A pinned tag is immutable, so a URL you paste into a project file keeps working and keeps meaning
the same thing. @main moves on every push — useful while you are
following along, less so in a file someone reads in a year.
Example prompts
Anything that can fetch a URL — Claude Code, Cursor, and most assistants with web access — needs nothing more than the link. Give it the reference first, in the same message as the task, so it is reading rather than recalling.
Starting something new
Read https://78uikit.com/llms-full.txt, then build me an analytics dashboard
using the 78 UI Kit — a topbar and sidebar app shell, a row of KPI cards with
sparklines, and a table. Load the kit from the CDN. Use only classes and tokens
that appear in that reference.That last sentence does most of the work. Without it an assistant will happily invent a class that fits the naming pattern; with it, anything it cannot find in the reference has to be written as your own CSS, where you will see it.
Adding the kit to a project you already have
We're adopting the 78 UI Kit. Read https://78uikit.com/llms-full.txt first,
then convert src/settings.html to use it: kit classes for the buttons, form
controls and cards, the pre-paint theme snippet in the <head>, and no hardcoded
colors — use the kit's tokens. Leave the page's own layout CSS alone.Theming
Read https://78uikit.com/llms-full.txt, then write me a theme override block
for the 78 UI Kit with a deep green accent, for both light and dark. Set the
whole accent group, not just --accent.Or skip the prompt: the theme generator writes that block for you, contrast-checked, and no assistant is going to beat it at the color math.
Keeping it around
A URL in one message is forgotten by the next session. For a project you will keep working on, put
the pointer somewhere the assistant reads every time —
CLAUDE.md for Claude Code, a project rules file for Cursor-style
tools, or whatever your assistant loads on startup:
## UI
This project uses the 78 UI Kit (v0.4.0), loaded from the jsDelivr CDN.
Before writing or changing any markup, read the kit's reference:
https://cdn.jsdelivr.net/gh/1978io/78UIKit@v0.4.0/llms-full.txt
Use its classes and tokens. Do not hardcode colors, and do not invent
`_78-` classes that are not in that file.No web access?
Some setups are offline, or behind a proxy that will not fetch an arbitrary URL. Download the file into the project and point at the local path instead — it is one file, and it diffs cleanly when you upgrade:
curl -o docs/78uikit-llms-full.txt \
https://cdn.jsdelivr.net/gh/1978io/78UIKit@v0.4.0/llms-full.txt
In a chat interface with no tools at all, the file is small enough to paste in whole before your
question. The short /llms.txt is the one to paste if context is tight.
What to expect
The reference covers the kit's public API and nothing else — it will not tell an assistant what your product does or how your pages are laid out. Two things are worth checking in whatever comes back, because they are where a confident guess still slips through:
-
Invented classes. The naming is regular enough to imitate, so
_78-btn-secondaryreads as real. If a class does not appear in the reference or in Components, it does not exist, and it renders as nothing. -
Half a theme. Setting
--accentalone leaves every hover, tint, glow and focus ring on the old color. The reference says so, and an assistant may still do it — Theming has the full list.