Skill UI

This comprehensive guide provides a step-by-step walkthrough for deploying a minimal, functional full-stack application to Vercel. It covers setting up both static HTML landing pages and robust serverless API routes using TypeScript. This skill is ideal for beginners starting new Vercel projects, testing deployment pipelines, or learning the core patterns of modern serverless function implementation.

Generates complete, production-ready landing pages using Next.js/React and Tailwind CSS. It incorporates proven copywriting frameworks (AIDA, PAS, BAB), optimizes for SEO with structured data, and adheres to Core Web Vitals standards (LCP, CLS). Ideal for creating high-performing marketing homepages, lead capture forms, and campaign sites.

Anime.js is a powerful and lightweight JavaScript animation engine designed for creating high-fidelity, complex web animations. It provides precise control over DOM, CSS, and SVG elements, allowing developers to build sophisticated, award-caliber user interfaces. Ideal for orchestrating multi-stage landing pages, implementing staggered reveals, and animating intricate SVG paths using advanced easing functions and timelines.

A specialist in building highly interactive, spatial, and weightless web interfaces using advanced techniques like GSAP, 3D CSS transforms, and React. This skill excels in implementing modern visual trends such as glassmorphism and isometric grids, providing a premium, immersive feel for sophisticated dashboards and landing pages.

Generates a complete, single-page SaaS landing page structure. This tool produces a fully contained HTML file, integrating required sections such as Hero, Features, Social Proof, Pricing, and Call-to-Action (CTA). It strictly adheres to an existing design system for colors, typography, and layout, making it ideal for product launches and marketing campaigns.

Generates a highly polished, self-contained single-page HTML landing page optimized for maximum conversion. It incorporates advanced features like 3D CSS animations, GSAP scroll effects, and mouse parallax depth. To ensure accuracy, the skill uses a structured intake process (product pitch, target audience, brand colors, and tone) to build a conversion-ready page that reflects the actual product, not generic boilerplate. Outputs a single, deployable HTML file.