saas-landing-gen

Generate a complete SaaS landing page with EdgeOne Pages deployment.

IndexedMIT★ 191

Install

Works with Claude Code, Claude apps, Codex, Cursor, Gemini CLI, GitHub Copilot, VS Code, OpenCode, Goose, Windsurf. Read the repository before you give any tool access to your data.

npx agentmarket install skill/tencentedgeone-saas-landing-gen

Asks which of your tools to add it to (Claude Code, Codex, Cursor, VS Code, Windsurf, Gemini CLI, Claude Desktop) and shows the change first. See https://agentmart.dev/cli.

Get the weekly diff

The weekly diff: one email a week with new agent tools, notable updates and grade changes, plus security alerts for tools you follow. Double opt-in, one-click unsubscribe.

About

Generate a complete SaaS landing page with EdgeOne Pages deployment. Includes hero section, features, pricing, testimonials, and CTA sections. Supports React + Tailwind CSS, one-command deploy to EdgeOne Pages.

Use cases: frontend, devops

Reviews

Write a review

No reviews yet. Installed it? Reviews come from verified installers only. How reviews work

Permissions

What this skill can do and what it asks for, from its SKILL.md. Checked Oct 25, 2026.

Tools: No tools found
Secrets: None asked for
Install scripts: None found

Network hosts it talks to 1

codeload.github.com · found in install command

Files it touches

~/.claude/skills/saas-landing-gen

What's inside

Skill name: saas-landing-gen
Description: Generate a complete SaaS landing page with EdgeOne Pages deployment. Includes hero section, features, pricing, testimonials, and CTA sections. Supports React + Tailwind CSS, one-command deploy to EdgeOne Pages.
License: MIT
Instructions: 213 lines in SKILL.md · view on GitHub

Files (1)

SKILL.md

SKILL.md (first lines)

# SaaS Landing Page Generator Skill

## Trigger Words
- "帮我做一个 SaaS 落地页"
- "generate a saas landing page"
- "创建一个软件产品官网"
- "landing page for my saas"

## What This Skill Does
Generates a complete, production-ready SaaS landing page and deploys it to EdgeOne Pages in one flow.

Output: a hosted URL + full source code.

## Tech Stack
- Framework: React 18 + Vite
- Styling: Tailwind CSS
- Deployment: EdgeOne Pages (auto)
- Optional: Edge Functions for form handling

## Workflow

### Step 1: Gather Requirements
Ask the user (or infer from context):
1. Product name / brand
2. Tagline / one-liner
3. Key features (3-5)
4. Pricing tiers (optional)
5. Color scheme preference

If info is missing, use sensible defaults and proceed.

### Step 2: Generate the Code
Create a Vite + React + Tailwind project with the following structure:

```
saas-landing/
├── index.html
├── package.json
├── vite.config.js
├── tailwind.config.js
├── postcss.config.js
├── src/
│   ├── main.jsx
│   ├── App.jsx
│   ├── index.css
│   └── components/
│       ├── Navbar.jsx
│       ├── Hero.jsx
│       ├── Features.jsx
│       ├── Pricing.jsx
│       ├── Testimonials.jsx
│       ├── CTA.jsx
│       └── Footer.jsx
└── public/
    └── favicon.svg
```

### Step 3: Deploy to EdgeOne Pages
After generating code, run:

```bash
# Install EdgeOne Pages CLI
npm install -g edgeone-pages-cli

# Deploy
edgeone-pages deploy . --name <project-name>
```

Or guide user to connect Git repo to EdgeOne Pages for auto-deploy.

## Code Templates

### package.json
```json
{
  "name": "saas-landing",
  "private": true,
  "version": "1.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview"
  },
  "dependencies": {
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  },
  "devDependencies": {
    "@types/react": "^18.2.0",
    "@types/react-dom": "^18.2.0",
    "@vitejs/plugin-react": "^4.2.0",
    "autoprefixer": "^10.4.17",
    "postcss": "^8.4.33",
    "tailwindcss": "^3.4.1",
    "vite": "^5.0.0"
  }
}
```

### tailwind.config.js
```js
/** @type {import('tailwindcss').Config} */
export default {
  content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
  theme: {
    extend: {
      colors: {
        brand: {
          50: '#eff6ff',
          100: '#dbeafe',
          200: '#bfdbfe',
          300: '#93c5fd',
          400: '#60a5fa',
          500: '#3b82f6',
          600: '#2563eb',
          700: '#1d4ed8',
          800: '#1e40af',
          900: '#1e3a8a',

From TencentEdgeOne/awesome-website-prompts-and-skills, MIT.

Compare and alternatives

Featured in

Signals

Stars: 191
Forks: 28
Open issues: 0
Last commit (this folder): May 15, 2026 (5 months ago)

From GitHub (fetched Oct 24, 2026).

Details

License: MIT
Repository: github.com/TencentEdgeOne/awesome-website-prompts-and-skills
Website: edgeone.ai/awesome-website-prompts-and-skills?from=github
First seen: Oct 24, 2026
Last checked: Oct 24, 2026
Source: GitHub github-graphql