UI UX Pro Max
saoudi-h/solar-icons
UI/UX design intelligence for web and mobile. An agent skill from saoudi-h/solar-icons.
Comprehensive guide for creating effective landing pages using Next.js or React.
Install Landing Page Guide
$ npx skills add bear2u/my-skills --skill landing-page-guide -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install bear2u/my-skills landing-page-guide --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/bear2u/my-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/landing-page-guide .claude/skills/landing-page-guide && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "landing-page-guide" agent skill from https://github.com/bear2u/my-skills/tree/master/skills/landing-page-guide into .claude/skills/landing-page-guide/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "landing-page-guide", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/bear2u/my-skills/tree/master/skills/landing-page-guideType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add bear2u/my-skills --skill landing-page-guide -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install bear2u/my-skills landing-page-guide --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/bear2u/my-skills.git skills-src && mkdir -p .agents/skills && cp -r skills-src/skills/landing-page-guide .agents/skills/landing-page-guide && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "landing-page-guide" agent skill from https://github.com/bear2u/my-skills/tree/master/skills/landing-page-guide into .agents/skills/landing-page-guide/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "landing-page-guide", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add bear2u/my-skills --skill landing-page-guide -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install bear2u/my-skills landing-page-guide --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/bear2u/my-skills.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/skills/landing-page-guide .cursor/skills/landing-page-guide && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "landing-page-guide" agent skill from https://github.com/bear2u/my-skills/tree/master/skills/landing-page-guide into .cursor/skills/landing-page-guide/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "landing-page-guide", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/bear2u/my-skills.git --path skills/landing-page-guide--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add bear2u/my-skills --skill landing-page-guide -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install bear2u/my-skills landing-page-guide --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/bear2u/my-skills.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/skills/landing-page-guide .gemini/skills/landing-page-guide && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "landing-page-guide" agent skill from https://github.com/bear2u/my-skills/tree/master/skills/landing-page-guide into .gemini/skills/landing-page-guide/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "landing-page-guide", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install bear2u/my-skills landing-page-guideInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add bear2u/my-skills --skill landing-page-guide -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/bear2u/my-skills.git skills-src && mkdir -p .github/skills && cp -r skills-src/skills/landing-page-guide .github/skills/landing-page-guide && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "landing-page-guide" agent skill from https://github.com/bear2u/my-skills/tree/master/skills/landing-page-guide into .github/skills/landing-page-guide/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "landing-page-guide", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add bear2u/my-skills --skill landing-page-guide -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install bear2u/my-skills landing-page-guide --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/bear2u/my-skills.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/skills/landing-page-guide .opencode/skills/landing-page-guide && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "landing-page-guide" agent skill from https://github.com/bear2u/my-skills/tree/master/skills/landing-page-guide into .opencode/skills/landing-page-guide/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "landing-page-guide", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Facts
- Skill name
landing-page-guide- GitHub stars
- 932
- Token cost
- ~2.4k tokens
- SKILL.md length
- 981 words
- Files
- 3 (incl. references)
- Skills in repo
- 16
- Repo updated
- First seen
- Licence
- None found
At a glance
Comprehensive guide for creating effective landing pages using Next.js or React.
- Works in 6 steps: Setup Metadata (SEO) → Create Component Structure → Use ShadCN UI Components → …
- Tasks that involve Landing pages
- SKILL.md covers Overview, When to Use This Skill, The 11 Essential Elements… and Technology Stack Requirements, plus 7 more sections
- Calls npx
What it does
Landing Page Guide is an agent skill from bear2u/my-skills. Comprehensive guide for creating effective landing pages using Next.js or React. This skill should be used when users request to create landing pages, marketing pages, or product pages that require the 11 essential elements for high-converting landing pages. Specifically designed for Next.js 14+ App Router with ShadCN UI components.
Its SKILL.md is about 2.4k tokens, which your agent loads only when the skill is triggered. The skill folder holds 3 other files, including reference files (for example `references/11-essential-elements.md` and `references/component-examples.md`).
It sits in Frontend & Design, covering Landing pages. It works with shadcn/ui, Next.js and React. The repository describes itself as: 자주 사용하는 스킬들을 모은 나의 클로드 스킬들입니다.
When your agent uses it
- Tasks that involve Landing pages
Example prompts
- “/landing-page-guide”
Requirements
- Node.js
Workflow steps
6 steps, taken from the step headings in SKILL.md.
- Setup Metadata (SEO)
- Create Component Structure
- Use ShadCN UI Components
- Implement Responsive Design
- Optimize Performance
- Ensure Accessibility
What it can do on your machine
Read from SKILL.md and the folder at commit 8ed5784. It shows what the files ask for, not the result of running them.
Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
Shell commands in SKILL.md call:
npx
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md. Its commands use npx, which can reach the network depending on how they are called.
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Context cost
Landing Page Guide loads about 2.4k tokens when it runs, and up to ~8.3k if it reads all its reference files. Until then it costs about 88 tokens; SKILL.md has 981 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
Safety
Auto-check passed
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
SKILL.md
Without a licence we can't republish the file, so here is its outline and opening line. It has 981 words (~2,387 tokens).
“This skill enables creation of professional, high-converting landing pages following the 11 essential elements framework from DESIGNNAS. It provides complete implementation patterns for Next.js 14+ and React with ShadCN UI integration, ensuring every landing page includes proper SEO optimization, accessibility…”
- name
- landing-page-guide
Files
SKILL.md and 2 other files (references) in skills/landing-page-guide of bear2u/my-skills.
- SKILL.md
- references/11-essential-elements.md
- references/component-examples.md
Open the folder on GitHubat commit 8ed5784
Compare with similar skills
Landing Page Guide next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Landing Page Guide this skillbear2u/my-skills | 932 | — | ~2.4k | Automated safety check: Pass | None | |
| UI UX Pro Maxsaoudi-h/solar-icons | 190 | 18 repos | ~11k | Automated safety check: Notes | Custom licence | |
| Frontend Design UltimateaAAaqwq/AGI-Super-Team | 105 | 2 repos | ~2.7k | Automated safety check: Pass | MIT | |
| Billing SDKhashgraph-online/awesome-codex-plugins | 1.3k | — | ~3.5k | Automated safety check: Notes | Apache-2.0 | |
| Creative Tim UI Blockscreativetimofficial/ui | 12k | — | ~2.1k | Automated safety check: Notes | MIT | |
| Cosscrafter-station/petdex | 4.2k | — | ~1.4k | Automated safety check: Pass | MIT |
Similar skills
Frontend Design Ultimate
aAAaqwq/AGI-Super-Team
Create distinctive, production-grade static sites with React, Tailwind CSS, and shadcn/ui — no mockups needed.
Billing SDK
hashgraph-online/awesome-codex-plugins
BillingSDK, the open-source React and shadcn component library for Dodo Payments billing UI.
Creative Tim UI Blocks
creativetimofficial/ui
Helps install, generate and review Creative Tim UI blocks: shadcn/ui-based React and Tailwind sections that follow a restrained, production-minded design philosophy.
Coss
crafter-station/petdex
Helps implement coss UI components correctly. An agent skill from crafter-station/petdex.
Ss Learn
bitjaru/styleseed
Capture a human-approved UI design lesson as a privacy-minimized local StyleSeed candidate, review it, and prepare an opt-in share package without transmitting project code, prompts, screenshots, or…
More from bear2u/my-skills
All 16 skills in this repoFlutter Init
bear2u/my-skills
A skill your agent uses when user wants to create a new Flutter project (Todo/Habit/Note/Expense/Custom domain) with Clean Architecture, Riverpod 3.0, Drift, and modern Flutter stack
Nextjs15 Init
bear2u/my-skills
A skill your agent uses when user wants to create a new Next.js 15 project (Todo/Blog/Dashboard/E-commerce/Custom domain) with App Router, ShadCN, Zustand, Tanstack Query, and modern Next.js stack
Prompt Enhancer
bear2u/my-skills
Enhance user prompts by analyzing project context (code structure, dependencies, conventions, existing patterns).
Chatgpt Web Research
bear2u/my-skills
Use the user's already signed-in official ChatGPT website account, especially GPT-5.5 Pro / ChatGPT Pro, to perform product research, market research, competitor research, second-opinion research…
Design Prompt Generator V2
bear2u/my-skills
Advanced 7-step hierarchical design prompt generator for AI web development tools (Lovable, Cursor, Bolt).
Gemini Logo Remover
bear2u/my-skills
Remove Gemini logos, watermarks, or AI-generated image markers using OpenCV inpainting.
Related
Categories
Questions about Landing Page Guide
What does Landing Page Guide do?
Comprehensive guide for creating effective landing pages using Next.js or React. Landing Page Guide is an agent skill from bear2u/my-skills.js or React.
When should I use Landing Page Guide?
Landing Page Guide fits situations like: tasks that involve Landing pages.
How do I install Landing Page Guide in Claude Code?
Run `npx skills add bear2u/my-skills --skill landing-page-guide -a claude-code`. Or copy the skill folder (skills/landing-page-guide in bear2u/my-skills) into .claude/skills/landing-page-guide in your project. Claude Code loads it when a task matches its description.
How do I install Landing Page Guide in Codex?
Run `npx skills add bear2u/my-skills --skill landing-page-guide -a codex`. Or copy the skill folder (skills/landing-page-guide in bear2u/my-skills) into .agents/skills/landing-page-guide in your project. Codex loads it when a task matches its description.
Can I use Landing Page Guide in Cursor, Gemini CLI or GitHub Copilot?
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add bear2u/my-skills --skill landing-page-guide -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/landing-page-guide, .gemini/skills/landing-page-guide, .github/skills/landing-page-guide and .opencode/skills/landing-page-guide in your project.
What does Landing Page Guide need to run?
Going by SKILL.md and its folder, Landing Page Guide needs the command-line tools its instructions call (npx). Our summary lists: Node.js.
Does Landing Page Guide access the network?
SKILL.md contains no URLs. Its commands use npx, which can reach the network depending on how they are called. This is read from the text; nothing was executed.
Is Landing Page Guide safe to install?
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
What licence does Landing Page Guide use?
No licence was found for Landing Page Guide or its repository. Without one, default copyright applies: ask the author before reusing or redistributing it.
How many tokens does Landing Page Guide use?
About 2.4k tokens (SKILL.md is roughly 9.5k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 5.9k tokens, read only when the agent opens those files.
What are the alternatives to Landing Page Guide?
Skills that share tags, products or a category with Landing Page Guide: UI UX Pro Max (saoudi-h/solar-icons, 190 stars), Frontend Design Ultimate (aAAaqwq/AGI-Super-Team, 105 stars), Billing SDK (hashgraph-online/awesome-codex-plugins, 1.3k stars) and Creative Tim UI Blocks (creativetimofficial/ui, 12k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains Landing Page Guide?
bear2u (a GitHub user) maintains it in bear2u/my-skills, which has 932 GitHub stars. The repository holds 16 skills in this directory. The repository was last updated on June 22, 2026.
Source: bear2u/my-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.