Agent Skills, Assets and Tools for a Landing Page

# Landing page: what to use (AgentGid, 2026-10-23)

## Agent Skills (install once)
- npx skills add coreyhaines31/marketingskills --skill cro  # cro: When the user wants to optimize, improve, or increase conversions on any marketing page or
- npx skills add AgriciDaniel/claude-ads --skill ads-landing  # ads-landing: Audit paid-ad landing pages for message match, mobile experience, performance, accessibili
- npx skills add irinabuht12-oss/marketing-skills --skill landing-page-audit-39  # landing-page-audit-39: CRO analysis for landing pages evaluating headline clarity, CTA placement, trust signals, 
- npx skills add irinabuht12-oss/marketing-skills --skill landing-page-audit  # landing-page-audit: Reviews your landing pages against the ads driving traffic to them. Checks for message mat
- npx skills add nowork-studio/notfair-plugin --skill google-ads-landing  # google-ads-landing: Score and diagnose Google Ads landing pages. Use when asked to audit a landing page, check
- npx skills add aaron-he-zhu/aaron-marketing-skills --skill landing-experience-checker  # landing-experience-checker: Use when the user asks to "pre-launch check the landing page", "run a Quality-Score prefli
- npx skills add aaron-he-zhu/aaron-marketing-skills --skill landing-optimizer  # landing-optimizer: Use when the user asks to "optimize our landing page for influencer traffic", "fix our pro
- npx skills add elayadesign/ai-design-skills --skill landing-page-design  # landing-page-design: Complete system for building high converting landing pages: intake questions, page structu
- npx skills add wondelai/skills --skill cro-methodology  # cro-methodology: Audit websites and landing pages for conversion issues and design evidence-based A/B tests
- npx skills add LeoYeAI/openclaw-master-skills --skill aes-landing-page-builder  # aes-landing-page-builder: Design high-converting ecommerce landing page structures with headline copy, hero sections

## Libraries
- npm install framer-motion  # Framer Motion, Gid Score 84
- npm install motion  # Motion, Gid Score 78
- npm install embla-carousel-react  # Embla Carousel, Gid Score 74
- npm install gsap  # GSAP, Gid Score 73
- npm install tailwindcss-animate  # Tailwind CSS Animate, Gid Score 73
- npm install lucide-react  # Lucide React, Gid Score 86
- npm install @radix-ui/react-slot  # Radix UI, Gid Score 84
- npm install shadcn  # shadcn/ui, Gid Score 81

## Content sources (follow each license line)
- StockSnap.io (Stock photos and images). Free stock photo website where every photo is released under the CC0 license. Price: free; commercial use OK; no credit needed; no bots or bulk downloading (get files by hand or through the official API, if there is one).
  Connect: download from https://stocksnap.io/ (no API).
  Rule: Do not imply endorsement by the photographer or by any person or product shown in the image.
  Rule: Do not scrape, crawl or bulk-download the site with bots or scripts; download images individually.
  Rule: Do not hotlink; download files and host them yourself.
  Rule: For photos showing identifiable people or property, obtain a model or property release for commercial use.
  License: https://stocksnap.io/license (checked 2026-10-13; details: https://agentgid.com/assets/stocksnap/)
- Flickr (Stock photos and images). Photo-sharing site with a large Creative Commons and public-domain photo set, plus a REST API. Price: free; commercial use with conditions; credit depends on the item; ship inside your app with conditions.
  Connect: API docs https://www.flickr.com/services/api/ (API key needed). Limits: No request numbers read; show at most 30 photos per page; cache photos only for reasonable periods.
  Get files: Flickr REST API (https://www.flickr.com/services/api/) with an API key.
  Not allowed: Commercial applications must apply for a commercial API key
  Not allowed: Do not display more than 30 Flickr user photos per page or use an unreasonable amount of bandwidth
  Not allowed: Do not cache or store Flickr user photos other than for reasonable periods
  Not allowed: Follow each photo owner's usage requirements
  Rule: Use a photo commercially only if its license allows it (e.g. CC BY, CC BY-SA, CC0); NC and ND licenses limit this.
  Rule: Apps using the API need a notice that the product uses the Flickr API but is not endorsed by SmugMug.
  Rule: Commercial apps must apply for a commercial API key.
  Rule: Remove a photo within 24 hours if its owner asks.
  License: https://www.flickr.com/creativecommons/ (checked 2026-10-20; details: https://agentgid.com/assets/flickr/)
- React Kawaii (Illustrations). Open source library of cute SVG illustrations delivered as React components. Price: free; commercial use OK; no credit needed. Style: playful.
  Connect: npm react-kawaii.
  Get files: npm install --save react-kawaii; import a component (e.g. Planet) and render it with size, mood and color props (svg (React components)).
  Not allowed: The copyright and permission notice must be included in all copies or substantial portions
  Rule: Install via npm (react-kawaii) and import the components you need.
  Rule: Keep the MIT license file and copyright notice with any distributed copies of the code.
  License: https://github.com/elizabetdev/react-kawaii/blob/HEAD/LICENSE.md (checked 2026-10-12; details: https://agentgid.com/assets/react-kawaii/)
- Blush (Illustrations). Customizable illustration collections by artists, downloadable as PNG or SVG, with Figma and Sketch plugins. Price: free tier; commercial use OK; no credit needed.
  Connect: download from https://blush.design (no API).
  Rule: Do not re-sell or re-distribute Blush illustrations on their own, or as a compiled set.
  Rule: Do not use illustrations as the basis for merchandising, such as printing them straight onto T-shirts.
  Rule: Do not compile Blush illustrations to build a similar or competing service.
  Rule: Do not claim ownership of an illustration, even a modified one; the artist keeps it.
  License: https://blush.design/license (checked 2026-10-22; details: https://agentgid.com/assets/blush/)
- Lucide (Icons). ISC-licensed icon set (Feather fork) with packages for React, Vue, Svelte, Angular and more. Price: free; commercial use OK; no credit needed. Style: minimal, outline.
  Connect: community MCP server github.com/SeeYangZhi/lucide-icons-mcp; npm lucide-react.
  Get files: npm packages (lucide-react, @lucide/vue, @lucide/svelte, lucide-solid, @lucide/angular, lucide-static, core lucide) or static SVG/sprite/icon font; docs for LLMs at lucide.dev/llms.txt (svg).
  Not allowed: Keep the copyright and permission notice in all copies
  Rule: Keep the copyright and permission notice in all copies.
  License: https://lucide.dev/license (checked 2026-10-10; details: https://agentgid.com/assets/lucide/)
- Heroicons (Icons). MIT-licensed SVG icons from Tailwind Labs with React and Vue packages. Price: free; commercial use OK; no credit needed. Style: outline, filled.
  Connect: npm @heroicons/react.
  Get files: npm install @heroicons/react or @heroicons/vue, or copy the SVG source from heroicons.com (svg).
  Not allowed: Keep the MIT copyright and permission notice in all copies or substantial portions
  Rule: Keep the MIT copyright and permission notice in copies.
  License: https://github.com/tailwindlabs/heroicons/blob/master/LICENSE (checked 2026-10-10; details: https://agentgid.com/assets/heroicons/)
- Google Fonts (Fonts). Open-source font catalog with a Developer API for metadata, a CSS API and the Google Design MCP. Price: free; commercial use OK; no credit needed; ship inside your app with conditions.
  Connect: official MCP server https://design.googleapis.com/mcp; API docs https://developers.google.com/fonts/docs/developer_api (API key needed). Limits: API key required; quota not stated.
  Get files: Developer API: GET https://www.googleapis.com/webfonts/v1/webfonts?key=YOUR-API-KEY returns a files map of TTF URLs on fonts.gstatic.com (add capability=WOFF2 for woff2). CSS API: https://fonts.googleapis.com/css?family=.. . Whole collection: https://github.com/google/fonts/archive/main.zip (needs no key) (ttf, woff2).
  Not allowed: Most fonts are SIL OFL 1.1, some Apache 2, the Ubuntu fonts use the Ubuntu Font License 1.0; each family folder has its own license file.
  Not allowed: OFL fonts cannot be sold by themselves, only bundled with software.
  Not allowed: Modified OFL fonts cannot use the Reserved Font Name.
  Rule: Keep the license file with font files you bundle in an app.
  Rule: Respect Reserved Font Names when you modify a font.
  License: https://github.com/google/fonts (checked 2026-10-10; details: https://agentgid.com/assets/google-fonts/)
- Fira Code (Fonts). Free monospaced programming font with ligatures for common multi-character code sequences, released under the SIL OFL 1.1. Price: free; commercial use OK; no credit needed.
  Connect: npm firacode.
  Get files: Download the release zip (Fira_Code_v6.2.zip) from GitHub releases, or load the npm package firacode@6.2.0 from the jsDelivr CDN (link or @import) (ttf, otf, woff, variable ttf).
  Not allowed: Keep the copyright notice and license text with every copy
  Not allowed: Do not sell the font files by themselves
  Not allowed: Do not use the Reserved Font Name for a modified version without written permission
  Rule: Keep the copyright notice and OFL license text with every copy of the font you ship or bundle.
  Rule: Do not sell the font files by themselves; bundling with software is allowed.
  Rule: Do not use the Reserved Font Name for a modified version without written permission.
  Rule: Distribute the font and any modified versions under the SIL OFL 1.1 only.
  License: https://github.com/tonsky/FiraCode/blob/HEAD/LICENSE (checked 2026-10-10; details: https://agentgid.com/assets/firacode/)
- Anime.js (UI animation (Lottie, Rive)). MIT JavaScript animation library for CSS, SVG, DOM attributes and JavaScript objects. Price: free; commercial use OK; no credit needed.
  Connect: npm animejs.
  Get files: npm i animejs.
  Not allowed: Keep the MIT copyright and permission notice in all copies or substantial portions
  Rule: Keep the MIT copyright and permission notice in copies.
  Rule: Install with npm i animejs (the site shows this command).
  License: https://github.com/juliangarnier/anime/blob/master/LICENSE.md (checked 2026-10-20; details: https://agentgid.com/assets/anime-js/)
- Bodymovin (lottie-web) (UI animation (Lottie, Rive)). After Effects extension that exports animations as JSON, plus the lottie-web JavaScript player that renders them in browsers. Price: free; commercial use OK; no credit needed.
  Connect: npm lottie-web.
  Get files: npm install lottie-web, or take lottie.js from the build/player folder of the repo, or the cdnjs bodymovin script (js, json).
  Not allowed: Keep the MIT copyright and permission notice in copies you ship.
  Not allowed: The license covers the player software; animation JSON files have their own licenses.
  Rule: Keep the MIT license file and copyright notice with any copies of the library you ship.
  Rule: Install the player from npm (lottie-web) or download lottie.js from build/player and serve it yourself.
  Rule: Gzip lottie.js for production, as the README advises.
  Rule: The MIT license covers the software only; check the license of any animation JSON files you load.
  License: https://github.com/airbnb/lottie-web/blob/HEAD/LICENSE.md (checked 2026-10-14; details: https://agentgid.com/assets/bodymovin/)

Install commands for the skills, the libraries, and each content source with its license rules. Paste it into AGENTS.md or your first prompt.

Agent Skills

Names and descriptions come from each skill's SKILL.md. Packs with more GitHub stars first, at most a few skills from one pack.

Libraries projects use for this

Web design Landing page Dashboard UI Mobile app Design polish Accessibility Web animation Product video Remove AI writing tells