Agent Skill

Preline MCP skill

preline-mcphtmlstreamofficial/prelineskills/preline-mcp/SKILL.md

Add, integrate, or build Preline UI components and blocks into HTML files via the Preline MCP server. Use when the user mentions "preline", says "/preline", asks to add a UI component, or requests a Preline block (a ready-made page section) using Preline UI.

6.5k

always on

66 tokname + description

once used

2,636 tokSKILL.md body

bundled files

419 KB

repo stars

6.5kGitHub

Install the Preline MCP skill

Skills CLI (Claude Code, Codex, Cursor and others)

npx skills add https://github.com/htmlstreamofficial/preline --skill preline-mcp

Claude Code, by hand (all projects)

git clone --depth 1 https://github.com/htmlstreamofficial/preline.git /tmp/preline
mkdir -p ~/.claude/skills
cp -R /tmp/preline/skills/preline-mcp ~/.claude/skills/preline-mcp

For one project only, copy the folder into .claude/skills/ in that project instead. The agent picks it up when a task matches its description.

What it costs your context

Agent Skills load in three steps. Tokens counted with the o200k tokenizer; your model's count will differ a little.

When	What loads	Cost
Every session	Name and description	66 tok
When the agent uses it	The SKILL.md instructions	2,636 tok
Only if opened	4 bundled files (19 KB)	varies

Until it is used, preline-mcp costs about 21× less than the median MCP server we measured (1,362 tokens on every turn). Installing all 2 skills from htmlstreamofficial/preline would load 155 tokens of descriptions. Skills vs MCP study

Checks

Our checks found nothing to flag: it follows the Agent Skills specification's naming and size guidelines and doesn't pipe downloads into a shell.

Checked 2026-10-22 · method

What's inside

The headings of its SKILL.md. Read the full file on GitHub.

Preline MCP
Intent
Defaults
Decision: Component vs Block
Clarifying Vague Requests
Composite & Layout Requests
Workflow: Components
Workflow: Blocks
Integration Rules
Smart Component Selection
Available Themes
Key References

More skills from htmlstreamofficial/preline

All skills in this repo

preline-theme-generatorhtmlstreamofficial/preline
Generate, preview, save, or validate Preline theme CSS using the bundled local generator in this skill. Use when the user asks to create a new Preline theme, match a brand color, translate a mood into a theme, generate light and dark theme CSS, preview theme output without writing files, or review and fix generated theme tokens. Do not use for generic non-Preline CSS work or arbitrary command execution.
6.5k389 tok idle · 465 in use