Responsive intent
Mobile stacking, desktop ordering, truncation, overflow, and breakpoint behavior are part of the brief.
AI Prompts, built for AI agents
One prompt. Any coding agent. Paste it wherever you build.
Works across coding agents and platforms
Claude Code
Cursor
Codex
Gemini CLI
Antigravity
Replit
v0
xAI
Kiro
OpenCode
Trae
Windsurf
GitHub Copilot
VS Code
What each prompt includes
Every AI Prompt is written around source details that are easy for agents to miss when they only see a screenshot or a block title.
Structure
Wrapper hierarchy, grid proportions, spacing, alignment, responsive order, and breakpoints stay explicit.
Tokens
Primary, muted, surface, border, and dark-mode roles map to the destination theme instead of fixed colors.
Assets
Logos, imagery, SVG marks, badges, and icon mappings stay tied to their real source paths and shapes.
Interactions
Menus, modals, tabs, tooltips, charts, and other behaviors keep their source states and runtime expectations.
QA checks
Every prompt ends with concrete visual, responsive, interaction, and accessibility checks for the agent to run.
Works like Magic
Choose a block, copy its prompt, and let your agent turn source-aware guidance into a working interface for your project.
Step 1
Choose a block
Browse Preline Blocks and pick the exact composition you want to bring into your app.
Step 2
Copy its AI Prompt
Switch to the AI Prompt tab and copy guidance written for that block’s real source.
Step 3
See the result
Let your agent inspect the app, implement the block, and verify its work against a focused checklist.
Built around your project, not a blank canvas
Each AI Prompt tells your agent to inspect your framework, Tailwind setup, theme tokens, existing components, routing, icons, and dark-mode strategy before writing code.
- Framework
- Tailwind setup
- Design tokens
- Existing components
- Routing and icons
- Dark mode
Before and after AI Prompt
The same block request becomes much clearer when your agent gets source-aware guidance.
Before
A plain request leaves the agent guessing structure, responsive behavior, tokens, assets, interactions, and QA details.
After
AI Prompt gives the agent a block-specific brief with layout, tokens, assets, interactions, responsive notes, and final checks.
972
Handcrafted AI Prompt Blocks
Choose a block, copy its prompt, and let your agent turn source-aware guidance into a working interface for your project.
Chart Compositions New
10 components
Dashboard Headers
7 components
Bar Charts New
9 components
KPI Cards
17 components
Product Review Sections
3 components
Product Grids
2 components
Project Tables
3 components
Hero Sections New
15 components
Create & Edit Form Modals
10 components
Checkout Flow Pages
8 components
Advanced Forms
5 components
Application Navbars
6 components
Preline Pro Pricing
Get lifetime access to downloadable Preline Pro blocks, templates, AI Prompts, and animated icons for unlimited Tailwind CSS projects, with free future updates. Preline MCP launch access is included through January 1, 2027.
Open Source
Free
Free access to the open-source library for unlimited projects and developers.
Free access, no account required
- Unlimited Projects
- Unlimited Developers
- Lifetime access Lifetime access to all free downloadable components, blocks, templates, and AI Prompts
- Free Updates
- AI Prompts New
- Access to all free 640+ components
- Access to 189 Blocks
- Download 5 premium templates with 5 main pages
- Free Figma Design System
- Community Support
- Re-Distribution Redistribution is allowed under the MIT and Fair Use licenses when attribution and license notices are preserved.
Pro
$249
Perfect for Solo Developers with unlimited personal and commercial projects.
- Unlimited Projects
- Single Developer
- Lifetime access Lifetime access to downloadable components, blocks, templates, AI Prompts, and Animated Icons
- Free Updates
- AI Prompts New
- Access to all free 640+ components
- Access to all 780+ Blocks
- Download all 21 premium templates with 207 pages
- Free Figma Design System
- 35 Animated Icons New
- General Support Priority general support for account, license, and product guidance. Does not include technical support, debugging, or custom implementation.
- No Re-Distribution Redistribution, public sharing, and use in derivative themes or 'generators' are prohibited. For details, check our license page.
- Preline MCP New Included free through January 1, 2027 Preline MCP is a hosted AI service. Free access is included through January 1, 2027. A subscription is required afterward. Rate limits may apply.
Team
$459
Ideal for small to medium teams for any number of commercial projects.
- Unlimited Projects
- Up to 15 Developers
- Lifetime access Lifetime access to downloadable components, blocks, templates, AI Prompts, and Animated Icons
- Free Updates
- AI Prompts New
- Access to all free 640+ components
- Access to all 780+ Blocks
- Download all 21 premium templates with 207 pages
- Free Figma Design System
- 35 Animated Icons New
- General Support Priority general support for account, license, and product guidance. Does not include technical support, debugging, or custom implementation.
- No Re-Distribution Redistribution, public sharing, and use in derivative themes or 'generators' are prohibited. For details, check our license page.
- Preline MCP New Included free through January 1, 2027 Preline MCP is a hosted AI service. Free access is included through January 1, 2027. A subscription is required afterward. Rate limits may apply.
Enterprise
Custom
Built for Re-Distribution, perfect for teams and projects of all sizes.
- Single Project
- Unlimited Developers
- Lifetime access Lifetime access to downloadable components, blocks, templates, AI Prompts, and Animated Icons
- Free Updates
- AI Prompts New
- Access to all free 640+ components
- Access to all 780+ Blocks
- Download all 21 premium templates with 207 pages
- Free Figma Design System
- 35 Animated Icons New
- SLA & Priority Support
- Re-Distribution In custom cases and under specific license terms and conditions, redistribution of Preline Pro may be permitted, depending on your project's specifics.
- Preline MCP New Included with Enterprise deployment
Standard local taxes and VAT may apply, following the laws of your country.
Have pricing or license questions?
AI Prompt FAQs
What is AI Prompt?
AI Prompt helps you bring Preline UI into your project using tools and platforms such as shadcn, Lovable, Replit, and others. Paste a block-specific prompt to recreate the UI with its structure, assets, tokens, interactions, responsive behavior, and QA guidance.
Learn moreWhat is the difference between AI Prompts and Preline MCP?
AI Prompts are block-specific instructions you copy and paste into your preferred AI coding tool or platform. Preline MCP is a direct tool connection that lets supported agents search and fetch Preline's latest components, blocks, documentation, and framework guidance.
Learn moreHow is it different from copying HTML?
HTML gives you markup. AI Prompt gives your coding agent the context needed to adapt that markup to your framework, theme, and application shell.
Which coding agents can use it?
Any agent that accepts pasted prompts can use it, including Claude Code, Cursor, Codex, Gemini CLI, Kiro, OpenCode, Trae, and Windsurf.
Does my project need Preline UI installed?
Not always. Preline-specific behavior and tokens are easiest to preserve when Preline UI is installed or your project has equivalent primitives.
Will it generate a pixel-perfect result?
It is designed to keep the result close to the source, but your agent should still review project-specific assets, interactions, and constraints.
Can I use it with my own design system?
Yes. The prompt identifies semantic roles and relationships so your agent can map them to the tokens and primitives already used in your project.
Still have questions?