Agent skill · htmlstreamofficial
preline-mcp
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.
What it needs
About 7k tokens when loaded.
What this skill does
Preline MCP Intent Use this skill to integrate Preline UI components and blocks into HTML files via the Preline MCP server. The server exposes 6 tools that return integration-ready HTML, CSS, and JS. Activate when: User says "preline", "add preline", "/preline", "use preline" User asks for a Tailwind CSS component from the Preline library User asks for a block (ready-made page section) or a starter page Defaults Never guess slugs. All section, component, and category identifiers are exact kebab-case strings. Always discover them via componentslist or blockscategories first. One at a time. Retrieve one component or block, integrate it fully, then move to the next. Always read the target file before inserting anything. Call componentslist({ section: "<inferred-slug>" }) when the component type is known - this keeps the response small. Omit section only when unsure. Decision: Component vs Block User says Use --- --- "component" / "components" Component workflow "block" / "blocks" (or "example" / "examples") Block workflow Ambiguous Use judgment; blocks give more complete results Clarifying Vague Requests Ask the user to pick instead of guessing in either of these cases: Abstract request. Too abstract to confidently map onto one category/section, let alone one block/component - e.g. "give me something for a pricing page", "I need a nice form", "show me a dashboard example". Start at step 1 below. Tied candidates. The request is concrete enough to reach a single category/section, but blocksincategory / componentslist({ section }) still leaves 2+ candidates whose titles + descriptions satisfy every criterion the request named about equally well (same layout/feature/style class), with nothing in the request to break the tie. Skip straight to step 3 below with just the tied candidates. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills htmlstreamofficial/preline-mcp