Menu
Skills dans ce dépôt
SkillsMP a collecté 70 skills depuis TheGoat395/Codex-Skills. Ouvrez un skill pour examiner sa source et ses détails.
TheGoat395/Codex-SkillsAffichage de 30 skills collectés sur 70.
Use when Codex needs premium visual inspiration sources, website galleries, studio references, product-site references, motion references, UI examples, luxury/editorial/Squarespace/Raycast/Linear/Vercel-level references, or a non-generic reference set before…
Langue du texte source : anglais
Premium website pre-build gate for cinematic, editorial, Squarespace-polished, Raycast/Linear/Vercel-precise, or motion-heavy web work. Use before implementing or redesigning a homepage, landing page, portfolio, product site, agency/studio site, or…
Langue du texte source : anglais
Use Radix Primitives for accessible custom React UI. Use for dialogs, dropdown menus, popovers, tooltips, tabs, accordions, switches, sliders, radio groups, checkboxes, select menus, navigation menus, focus management, keyboard interactions, and unstyled…
Langue du texte source : anglais
Build accessible React components for websites and apps. Use when creating buttons, links, menus, dialogs, tabs, accordions, carousels, forms, icon buttons, nav, skip links, focus states, keyboard behavior, ARIA, semantic markup, or reusable UI primitives.
Langue du texte source : anglais
Craft React component composition for websites and apps. Use when splitting large JSX files, creating reusable sections, primitives, slots, children-based composition, product UI components, portfolio sections, landing-page modules, design-system primitives,…
Langue du texte source : anglais
Craft polished React components for websites and apps. Use for reusable sections, UI primitives, composition, props, state, responsive behavior, interaction states, accessibility, and avoiding monolithic or brittle frontend implementations.
Langue du texte source : anglais
Design and implement React loading, error, empty, offline, retry, not-found, Suspense, skeleton, and route-boundary states. Use when a website or app needs polished fallbacks for data fetching, async UI, lists, forms, dashboards, product pages, commerce,…
Langue du texte source : anglais
Implement polished React form patterns. Use for contact forms, lead forms, booking forms, waitlists, checkout steps, newsletter signup, controlled or uncontrolled fields, validation, labels, errors, loading, success states, server actions, autocomplete,…
Langue du texte source : anglais
Build responsive React components and sections for premium websites. Use when components need mobile, tablet, desktop, container-query, CSS-grid, flex, aspect-ratio, text-fit, overflow, media-crop, navigation, dashboard density, or responsive interaction…
Langue du texte source : anglais
Discipline React state, derived data, effects, refs, reducers, context, and event handlers. Use when components have duplicated state, unnecessary useEffect, prop-to-state syncing, stale closures, event logic in effects, external subscriptions, DOM…
Langue du texte source : anglais
Design reduced-motion alternatives for websites and apps. Use for prefers-reduced-motion, Motion useReducedMotion, CSS media queries, disabling parallax, replacing large movement, simplifying scroll scenes, preserving state feedback, accessibility,…
Langue du texte source : anglais
Run responsive visual QA and polish for websites and apps. Use after building or editing any frontend to inspect desktop, laptop, tablet, and mobile widths; fix typography, spacing, overlaps, media crops, interactions, motion, forms, canvas rendering,…
Langue du texte source : anglais
Design non-generic website section layouts. Use when a page needs alternatives to card grids, bento overuse, generic feature blocks, repetitive centered sections, bland stat strips, or template-like section sequencing.
Langue du texte source : anglais
Run technical SEO QA for websites. Use for metadata, titles, descriptions, canonical URLs, robots, sitemap, Open Graph, structured data, heading structure, internal links, image alt, crawlability, noindex mistakes, redirects, JavaScript-rendered content, and…
Langue du texte source : anglais
Design surface, shadow, border, material, radius, glass, elevation, overlay, divider, and depth systems for premium websites and apps. Use when cards, panels, modals, nav, product UI, dashboards, luxury sections, or editorial layouts need polished material…
Langue du texte source : anglais
Create token-driven Tailwind and CSS variable systems for premium websites. Use for color tokens, typography tokens, spacing rhythm, radius, shadows, gradients, surfaces, responsive constraints, dark/light modes, and avoiding random utility-class styling.
Langue du texte source : anglais
Build responsive Tailwind CSS layouts for premium websites and apps. Use for breakpoints, mobile-first layout, grids, flex, spacing, container widths, aspect ratios, responsive typography, media crops, nav adaptation, dashboard density, and preventing mobile…
Langue du texte source : anglais
Create testimonial and proof systems for websites. Use for testimonials, reviews, customer quotes, logo walls, metrics, press quotes, case-study excerpts, ratings, social proof, proof strips, trust sections, and copy that must be credible, approved, and…
Langue du texte source : anglais
Use shadcn/ui, Radix-style primitives, and lucide-react icons without producing generic default UI. Use for dialogs, menus, accordions, tabs, forms, buttons, toolbars, icons, inputs, and app controls that need accessibility and polished custom styling.
Langue du texte source : anglais
Compose UI screenshots inside website layouts. Use for product sections, feature blocks, app showcases, case studies, dashboards, mockup stacks, detail crops, callout overlays, annotation systems, responsive screenshot art direction, and avoiding generic SaaS…
Langue du texte source : anglais
Direct website imagery, video, generative visuals, product renders, screenshots, gallery crops, hero media, thumbnails, and visual assets. Use when a site needs real or generated media rather than generic gradients, stock-like backgrounds, placeholder images,…
Langue du texte source : anglais
Inspect, test, and refine frontend visual quality before delivery. Use after building or editing websites, landing pages, portfolios, dashboards, games, interactive tools, cinematic sites, luxury sites, or any UI where Codex should run a second polish pass…
Langue du texte source : anglais
Use after frontend changes or before delivery to run rendered visual QA with Playwright/browser screenshots, viewport checks, console/network checks, overflow detection, canvas/media verification, before/after comparisons, and responsive polish review.
Langue du texte source : anglais
Use for premium frontend, website, app UI, landing page, dashboard, redesign, image-to-code, or visual-polish work that needs clearer design intent, adjustable visual direction, motion discipline, less generic output, and a final preflight check before…
Langue du texte source : anglais
Define vague website taste words as concrete design decisions. Use when prompts include premium, luxury, cinematic, modern, editorial, minimal, polished, brutalist, avant-garde, classy, clean, high-end, professional, Squarespace-like, Framer-like, or any…
Langue du texte source : anglais
Prompt generated imagery for premium websites. Use when Codex needs hero images, product scenes, editorial visuals, backgrounds, portraits, venue imagery, campaign art, texture assets, mockups, or image-generation direction for luxury, cinematic,…
Langue du texte source : anglais
Research and translate website references into reusable design constraints. Use when the user mentions Viktor Oddy, Squarespace, Raycast, Linear, Vercel, Framer, Awwwards, Codrops, luxury sites, cinematic websites, product-led sites, portfolios, or any…
Langue du texte source : anglais
Choose and enforce a precise art direction for modern websites. Use when the user asks for beautiful, premium, luxury, cinematic, editorial, Squarespace-like, Viktor-style, Framer-like, Raycast-like, Linear-like, Vercel-like, portfolio, product, service,…
Langue du texte source : anglais
Create a website blueprint before coding. Use for new sites, redesigns, image-to-site work, premium landing pages, portfolios, brand sites, product sites, and any frontend project where Codex should define pages, sections, assets, tokens, layout, motion, and…
Langue du texte source : anglais
Apply strict website-building operating rules for any frontend, website, landing page, portfolio, product site, luxury site, Squarespace-like site, modern SaaS/devtool site, or UI build. Use when Codex must inspect first, avoid generic design, explain planned…
Langue du texte source : anglais