design

shadcn-landing-page

Name: shadcn-landing-page
Author: leoMirandaa

Free Landing page template using Shadcn, React, Typescript and Tailwind

1,981 stars421 forksTypeScriptUpdated 10/9/2024100% free · open source

What it does

Shadcn-landing-page is a free, customizable landing page template built with Shadcn, React, TypeScript, and Tailwind, designed to help founders quickly create a professional-looking website.

When to use it

•You need a quick and easy way to create a landing page for your startup
•You want a customizable template that integrates well with modern web development tools
•You're looking for a free, open-source solution to reduce costs and maintain control over your website's code

Ready-to-paste prompt

Modify the `src/data/content.ts` file to add your own content, such as a hero section with a call-to-action button: `const hero = { title: 'My Landing Page', subtitle: 'Welcome to my website' };`

Heads up: Make sure you have Node.js (14 or later) and npm installed on your machine, as the template uses modern JavaScript features and dependencies that require a compatible runtime environment

Saves to your device

Use with Claude

New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

✅ Light setup

Installs with a command or two; your AI agent can do it for you.

Try it instantly — no install

Claude Code

mkdir -p ~/.claude/skills/shadcn-landing-page && curl -fsSL https://workflowstacks.com/api/skills/shadcn-landing-page/claude-skill -o ~/.claude/skills/shadcn-landing-page/SKILL.md

Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)

claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

How shadcn-landing-page works

Codeflow

Free to inspect

Shadcn-landing-page is a medium TypeScript project (~4.2k lines across 37 code files). Setup is light: installs like a normal app. Reading the code is optional. Last commit 25 months ago, MIT license, no tests found.

Size

Medium codebase

~4.2k lines · 37 code files · 35 min skim

Setup

One-command install

Installs like a normal app. Reading the code is optional.

Runs on

Node.js

No API keys detected

TypeScript 90%CSS 5%JavaScript 3%HTML 2%

Where to start reading

1
README.md
Start here — what it does and how to install it
2
src/App.tsx
Where the program starts running
3
package.json
Dependencies and the commands it exposes

What's in each folder

src/Core code — the actual logic43 files

public/Images & static assets1 files

READMENo tests foundThin docsNo CIMIT licenseLast update 25 mo ago

Use with Claude

New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

✅ Light setup

Installs with a command or two; your AI agent can do it for you.

Try it instantly — no install

Claude Code

mkdir -p ~/.claude/skills/shadcn-landing-page && curl -fsSL https://workflowstacks.com/api/skills/shadcn-landing-page/claude-skill -o ~/.claude/skills/shadcn-landing-page/SKILL.md

Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)

claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

Quick Actions

Details

Creator

leoMirandaa

Language

TypeScript