Skill Claude CodeCodex
Run adaptive, evidence-led, multi-pass research for consequential, complex, disputed, niche, or fast-changing questions without requiring repeated prompts for missing depth. Use for exhaustive research, due diligence, investigations, audits, fact checking, landscape mapping, comparative ranking, or source-backed…
Skill Claude CodeCodex
Motion and interaction design skill using interpretive lenses informed by publicly available work from Emil Kowalski, Jakub Krehel, and Jhey Tompkins. Two modes: build interactive components with purposeful motion, or audit existing animations to catch AI-generated motion anti-patterns. Use when creating, adding…
Skill Claude CodeCodex
Create refined typography for websites. Use for premium, editorial, luxury, portfolio, product, Squarespace-like, Vercel-like, Raycast-like, Linear-like, and modern sites needing font pairing, type scale, responsive headings, line length, hierarchy, captions, labels, and text polish.
Skill Claude CodeCodex
Resolve conflicting, stale, or ambiguous sources before answering, revising plans, or making claims; use when accuracy depends on distinguishing current fact, governing authority, inference, and recommendation.
Skill Claude CodeCodex
Prepare final website handoff. Use after completing a site, app, landing page, redesign, deployment, or production QA to summarize changed files, commands run, checks passed, local/deployed URLs, environment variables, content/CMS notes, known limitations, untested areas, and recommended next steps.
Skill Claude CodeCodex
Audit frontend websites and apps before launch. Use for production-readiness reviews, visual polish checks, responsive QA, accessibility risks, performance and SEO basics, interaction states, forms, media, copy clarity, trust signals, and ship/no-ship recommendations for React, Next.js, static sites, dashboards…
Skill Claude CodeCodex
Use before installing or recommending npm packages, GitHub repos, templates, MCP servers, plugins, Codex skills, ChatGPT skills, scripts, CLI tools, design libraries, scraping tools, or AI agent tools for frontend or website work. Produces trust classifications, install-safety decisions, safer alternatives, and…
Skill Claude CodeCodex
GSAP performance guidance — prefer transforms, avoid layout thrashing, use will-change selectively, and batch animation work. Use when optimizing GSAP animations, reducing jank, or when the user asks about animation performance, FPS, or smooth 60fps.
Skill Claude CodeCodex
Art-direct website hero imagery. Use for landing pages, homepages, product pages, portfolios, venue sites, editorial pages, and premium first viewports that need real or generated media, text-safe composition, responsive focal points, visual hierarchy, contrast, aspect ratios, and anti-generic image selection.
Skill Claude CodeCodex
Run responsive image crop QA for websites. Use after adding or changing images, hero media, galleries, product grids, portraits, venue photos, screenshots, background images, object-fit/object-position rules, art-directed picture sources, image dimensions, layout stability, and mobile crop polish.
Skill Claude CodeCodex
Run image and video loading QA. Use after adding or changing images, videos, posters, responsive sources, lazy loading, galleries, hero media, product media, background videos, image sequences, or CMS media to verify loading, dimensions, crops, network errors, alt/captions, and performance.
Skill Claude CodeCodex
Determine what follows from explicit premises, rules, evidence, documentation, or observations by selecting and executing the appropriate inference structure. Use when validity, entailment, contradiction, causality, probability, explanation, or the exact strength of a conclusion is central. Do not invoke merely to…
Skill Claude CodeCodex
Run mobile responsive QA for websites and apps. Use after layout, media, navigation, form, pricing, dashboard, gallery, checkout, or motion changes to inspect phone and tablet viewports, prevent horizontal overflow, fix crop issues, verify touch targets, and make mobile feel intentionally composed.
Skill Claude CodeCodex
Implement beautiful modern websites and web apps with an opinionated premium frontend stack. Use for Next.js, React, Tailwind, Motion, GSAP, Lenis, Three.js/React Three Fiber, shadcn/ui customization, responsive layouts, landing pages, portfolios, cinematic sites, luxury brand sites, Squarespace-like sites, and any…
Skill Claude CodeCodex
Define website motion direction before implementation. Use for cinematic websites, Viktor-style motion, GSAP/ScrollTrigger pages, Motion for React microinteractions, Framer-like transitions, scroll reveals, product storytelling, luxury pacing, and any site where animation should feel intentional rather than generic.
Skill Claude CodeCodex
Run motion performance QA for websites and apps. Use after adding Motion, GSAP, Lenis, scroll scenes, page transitions, hover states, carousels, WebGL sync, observers, timers, RAF loops, or any animation-heavy UI to catch jank, layout shift, leaks, cleanup bugs, reduced-motion gaps, and mobile issues.
Skill Claude CodeCodex
Implement Motion for React layout transitions. Use for layout prop, layoutId, shared element transitions, tabs, expanding cards, accordions, reordering lists, filterable grids, animated underline nav, product UI panels, portfolio previews, and smooth size/position changes in React.
Skill Claude CodeCodex
Implement refined React and Motion for React microinteractions. Use for buttons, menus, nav, modals, tabs, cards, accordions, layout transitions, reveal wrappers, hover/tap states, mobile menus, and interactive UI that should feel premium without heavy GSAP timelines.
Skill Claude CodeCodex
Create Motion for React page transitions and route transitions. Use for AnimatePresence, route-level enter/exit, view transitions, shared page elements, Next.js client navigation, loading transitions, portfolio detail transitions, and cinematic but accessible navigation motion.
Skill Claude CodeCodex
Implement Motion for React animation patterns for premium websites and apps. Use for motion/react, motion components, variants, initial/animate/exit, whileHover, whileTap, whileInView, useAnimate, useInView, useReducedMotion, MotionConfig, LazyMotion, microinteractions, reveal animations, and React-state-driven UI…
Skill Claude CodeCodex
Plan and implement Next.js App Router routing for premium websites and apps. Use when working with app/ routes, pages, layouts, templates, loading, error, not-found files, route groups, dynamic segments, nested navigation, Link usage, or homepage structure in a Next.js project.
Skill Claude CodeCodex
Design Next.js Server Component and Client Component boundaries. Use when deciding where to add use client, how to pass props from server to client, how to keep secrets off the client, how to reduce bundle size, how to interleave interactive components, or how to structure React components in App Router projects.
Skill Claude CodeCodex
Structure modern Next.js websites and landing pages. Use for App Router projects, TypeScript, metadata, fonts, images, static pages, route groups, sections, component organization, performance, SEO basics, and production-ready architecture for premium websites.
Skill Claude CodeCodex
Write and revise website copy so it feels specific, credible, and non-generic. Use for headlines, subheads, CTAs, navigation, product copy, service copy, luxury/editorial language, testimonials, empty states, forms, pricing, and any website where placeholder marketing or AI-sounding copy would weaken the design.