什么是 落地页生成器？

Landing Page Generator 是 Openclaw Skills 生态系统中为开发者设计的高效工具，适用于需要专业营销页面但又不想承担手动设计开销的开发者。通过利用现有的项目元数据，该技能可以自动创建英雄板块（Hero Sections）、功能网格和行动呼吁（CTA）组件。

该工具消除了对复杂模板或耗时 CSS 配置的需求，为项目展示提供了一键式解决方案。它专门为希望在发布后立即展示作品的创作者打造，确保每个项目从第一天起就拥有精美的网页呈现。

下载入口:https://github.com/openclaw/skills/tree/main/skills/lxgicstudios/landing-gen

安装与下载

1. ClawHub CLI

从源直接安装技能的最快方式。

2. 手动安装

将技能文件夹复制到以下位置之一

优先级：工作区 > 本地 > 内置

3. 提示词安装

将此提示词复制到 OpenClaw 即可自动安装。

落地页生成器 应用场景

• 为新发布的 npm 包快速部署营销页面。
• 为黑客松项目或早期原型创建专业的演示网站。
• 用交互式、更具视觉吸引力的落地页替换静态的 GitHub README。
• 在主网站开发期间快速搭建占位站点。

1. 工具扫描指定目录以定位并解析项目的 package.json 文件。
2. 提取项目名称、描述、关键词和仓库 URL 等元数据。
3. 处理提取的数据，生成具有集成样式的语义化、响应式 HTML。
4. 生成一个独立的 .html 文件并保存在本地，可随时在浏览器查看或部署。

落地页生成器 配置指南

Landing Page Generator 需要 Node.js 18+，可以通过 npx 执行而无需永久安装。

# 从当前目录生成落地页
npx ai-landing .

# 为特定项目路径生成落地页
npx ai-landing ~/projects/my-app

# 指定自定义输出文件名
npx ai-landing . -o index.html

落地页生成器 数据架构与分类体系

该技能利用 package.json 中的以下架构来填充生成的落地页：

name: landing-gen
description: Generate a beautiful HTML landing page from your package.json. Use when you need a quick marketing page for your project.

Landing Page Generator

You just shipped a package. Now you need a landing page but don't want to spend two hours messing with HTML and CSS. This tool reads your package.json and spits out a complete, good looking landing page in one command. No templates to configure, no design decisions to make.

One command. Zero config. Just works.

Quick Start

npx ai-landing .

What It Does

• Reads your package.json and pulls out the name, description, features, and repo links
• Generates a fully styled HTML landing page with hero section, feature grid, and CTA
• Outputs a single landing.html file you can deploy anywhere
• Handles responsive design automatically so it looks good on mobile
• Includes proper meta tags and semantic HTML out of the box

Usage Examples

# Generate from current directory
npx ai-landing .

# Generate from a specific project
npx ai-landing ~/projects/my-cool-lib

# Custom output file
npx ai-landing . -o index.html

Best Practices

• Write a good package.json description first - The better your description, the better the landing page copy will be
• Add keywords to package.json - They get used as feature highlights on the page
• Deploy to GitHub Pages - The output is a single HTML file, perfect for gh-pages
• Tweak the output - Use it as a starting point, then customize colors and copy to match your brand

When to Use This

• You just published an npm package and need a landing page fast
• You want a quick demo page for a hackathon project
• You need a placeholder site while you build the real one
• Your open source project needs a better first impression than a GitHub README

Part of the LXGIC Dev Toolkit

This is one of 110+ free developer tools built by LXGIC Studios. No paywalls, no sign-ups, no API keys on free tiers. Just tools that work.

Find more:

• GitHub: https://github.com/LXGIC-Studios
• Twitter: https://x.com/lxgicstudios
• Substack: https://lxgicstudios.substack.com
• Website: https://lxgic.dev

Requirements

No install needed. Just run with npx. Node.js 18+ recommended.

npx ai-landing --help

How It Works

The tool parses your package.json to extract project metadata. It then sends that info to an AI model that generates clean, semantic HTML with inline styles. The result is a single file landing page that you can open in any browser or deploy to any static host.

License

MIT. Free forever. Use it however you want.