Landing Page Builder

核心功能：根据用户文本需求或参考HTML模板，生成适配品牌风格、转化优化的响应式单页着陆页，支持内容定制与页面调整。典型场景：需制作着陆页、营销页等单页网站，或需改编现有HTML模板的内容/品牌。输入含业务信息、风格等，可选模板；输出为无额外依赖的独立HTML文件，可直接部署或本地打开。

热度 40.89

最近更新 2026-05-17 12:20:51

分类：开发依赖：读写文件 / 内部调用大模型应用场景：代码生成 / UI 原型 / 文案创作

安装技能

复制下面的话术发给你的 Agent，它会通过 secure-skills 检索并安装该技能。

执行命令安装此 skill： npx secure-skills-cli add landing-page-builder

Metadata

name: landing-page-builder
description: Build a single-page landing page from a text prompt or design brief. USE WHEN: - User asks for a landing page, marketing page, product page, sales page, or startup website - User provides a business name/idea and wants a deployable web page - User sends an HTML template and wants it adapted with new content/branding - User asks for a "one-pager" or "single-page site" DON'T USE WHEN: - User wants a multi-page website (use a web framework instead) - User wants an email template or newsletter (different format/constraints) - User wants a blog, documentation site, or wiki - User wants to edit an existing live site (this builds new pages, not patches) - User wants a web app with backend logic, auth, or databases OUTPUTS: Single self-contained .html file (no external dependencies except Google Fonts). Ready to open in browser, deploy to any static host, or deliver to a client. INPUTS: Business name, what it does, target audience, desired tone. Optionally: a reference HTML template to adapt.

Generate polished, conversion-optimized landing pages from natural language descriptions.

Read the provided template
Identify all text content, branding, and copy
Modify the existing template — do NOT rewrite from scratch
Replace copy, brand name, colors, and content to match the user's brief
Preserve ALL CSS, animations, layout structure, SVG filters, and JavaScript exactly
Output the adapted .html file

Ask the user (if not provided): product/service name, what it does, target audience, desired tone
Read the base template at assets/template.html
Replace all {{PLACEHOLDER}} tokens with content tailored to the user's request
Customize colors, copy, sections — add or remove sections as needed
Output a single self-contained .html file

Placeholder	Description
`{{TITLE}}`	Page `<title>`
`{{BRAND}}`	Brand/company name
`{{PRIMARY_COLOR}}`	Hex color (e.g., `#6366f1`)
`{{BG_COLOR}}`	Background color
`{{TEXT_COLOR}}`	Body text color
`{{ACCENT_COLOR}}`	Accent color
`{{HEADLINE}}`	Hero headline — punchy, benefit-driven
`{{SUBHEADLINE}}`	1-2 sentence supporting text
`{{CTA_TEXT}}`	Button text (e.g., "Start Free Trial")
`{{CTA_URL}}`	Button link
`{{FEATURES_HEADING}}`	Section heading
`{{FEATURES}}`	HTML feature cards (use `.feature-card` divs)
`{{PRICING_HEADING}}`	Section heading
`{{PRICING_CARDS}}`	HTML pricing cards (use `.price-card` divs)
`{{TESTIMONIALS_HEADING}}`	Section heading
`{{TESTIMONIALS}}`	HTML testimonial cards (use `.testimonial` divs)
`{{FINAL_CTA_HEADING}}`	Bottom CTA heading
`{{FINAL_CTA_TEXT}}`	Bottom CTA description
`{{YEAR}}`	Current year

Don't rewrite templates from scratch — when adapting a reference, modify in place. Rewriting loses the design quality.
Don't use generic stock copy — every line should feel specific to the business, not "lorem ipsum with nouns swapped in"
Don't add sections the user didn't ask for — less is more. A tight 3-section page beats a bloated 8-section page.
Don't break responsive behavior — test mentally that your changes work at mobile widths

Feel free to:

Save the final HTML file to the user's workspace or specified path. Suggest deployment options: