AI assistants learned about TRMNL from old copies of the web. Working from memory, they mix up Framework versions and make up class names. Give yours the current docs and the markup it writes works the first time far more often.
There are four ways to do it, from most to least capable.
Option 1 - Connect the MCP server
This is the best choice for building plugins. Your assistant reads the design system, writes markup to your private plugin and takes a screenshot of the result, so it can see its own mistakes. It works with Claude, ChatGPT, Cursor, VS Code, Codex and Gemini CLI. Setup for each one is in MCP Server.
In Claude Code, one plugin adds the server and the Framework rules together. Run "/plugin marketplace add usetrmnl/trmnl-agent-skills", then "/plugin install trmnl@trmnl-agent-skills". Instructions for other tools are in trmnl-agent-skills on GitHub.
Prefer to stay in your browser? The AI Agent builds plugins inside TRMNL with no setup.
Option 2 - Work locally with trmnlp
Coding assistants that run commands in a folder, such as Claude Code, Cursor and Codex, work well with trmnlp, our local plugin tool. It renders your plugin on your own computer, so the assistant can check its work as often as it likes. Nothing reaches your account until you push.
Install it with the Quick Start steps, then tell your assistant to use these commands:
trmnlp init my_plugin starts a new plugin. To work on one you made in the editor, run trmnlp login, then trmnlp clone my_plugin 123, where 123 is the plugin's id.
trmnlp lint checks the markup against TRMNL best practices and names each problem with its file and line.
trmnlp build --png renders a PNG of each layout into the _build folder. Assistants that read images can look at what they made.
trmnlp test is the one to lean on. Every plugin you init or clone comes with a test that draws all four layouts on the TRMNL OG and TRMNL X, in landscape and portrait, in dark mode, when your API fails, and with each option in your form. It fails on script errors, overlapping text, and values like undefined, NaN or raw Liquid left on the screen. API answers are fake data you choose and the clock is fixed, so every run gives the same result. Add --report report for a page with every screen it drew, including the OG and X side by side. Your assistant can write more tests, such as text that must appear or a layout that must not overflow. See Testing plugins.
trmnlp serve opens a live preview for you at localhost:4567.
trmnlp push uploads the plugin to your account when you're happy with it.
The step people skip is asking the assistant to check its own work. Say it plainly, for example: "Use trmnlp. After every change, run trmnlp lint and trmnlp test --report report, look at the screens in the report, and fix what you see before you tell me it's done."
Option 3 - Give it a link
Most assistants can open a link. Start your chat with one of these and say what you want, for example: "Read https://trmnl.com/llms.txt, then write TRMNL markup that shows today's weather on a TRMNL X."
Everything: trmnl.com/llms.txt. An index of every Framework page, the API reference and every help article, each with a link to a Markdown copy.
The whole Framework: trmnl.com/llms-full.txt. All Framework docs in one file, about 700 KB.
The API: trmnl.com/api-docs.md. Code generators want the OpenAPI file instead.
Plugin guides: docs.trmnl.com/go/llms.txt. Webhooks, polling, BYOD and BYOS.
One help article: add .md to the end of its link, like this one for Liquid 101.
Option 4 - Copy one page
Every Framework page has a Copy page button at the top right. Copy as Markdown puts the whole page on your clipboard, ready to paste into a chat. View as Markdown opens it in a new tab, and Copy Markdown link copies a link to it.
Use this when your assistant can't open links, or when you only need one topic, such as Grid or Charts.
Source code
The Framework is open source at usetrmnl/trmnl-framework, and the plugin guides at usetrmnl/api-docs. Coding assistants that work in a folder, such as Claude Code, Cursor and Codex, can read a clone of either.
Troubleshooting
The markup uses class names that don't exist.
Your assistant is working from memory. Give it llms-full.txt or one page's Markdown, and tell it to use only classes from that file. Or connect the MCP server, which checks the render.
The chat says the file is too large.
llms-full.txt is about 700 KB, more than some chats accept. Give it llms.txt instead and let it open only the pages it needs, or paste one page with Copy page.
The assistant can't open links.
Some chats can't browse the web. Use Copy as Markdown and paste the page in.
It looks right in the chat but wrong on my device.
A chat can't see how TRMNL renders. Paste the markup into a private plugin and check the preview. Better still, let the assistant see for itself with the MCP server or trmnlp build --png.
Missing something? Tell us at support@trmnl.com.