Menú
Skills en este repositorio
SkillsMP ha recopilado 70 skills de TheGoat395/Codex-Skills. Abre una skill para revisar su origen y sus detalles.
TheGoat395/Codex-SkillsMostrando 30 de 70 skills recopiladas.
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…
Idioma del texto original: inglés
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…
Idioma del texto original: inglés
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…
Idioma del texto original: inglés
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.
Idioma del texto original: inglés
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,…
Idioma del texto original: inglés
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.
Idioma del texto original: inglés
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,…
Idioma del texto original: inglés
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,…
Idioma del texto original: inglés
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…
Idioma del texto original: inglés
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…
Idioma del texto original: inglés
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,…
Idioma del texto original: inglés
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,…
Idioma del texto original: inglés
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.
Idioma del texto original: inglés
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…
Idioma del texto original: inglés
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…
Idioma del texto original: inglés
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.
Idioma del texto original: inglés
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…
Idioma del texto original: inglés
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…
Idioma del texto original: inglés
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.
Idioma del texto original: inglés
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…
Idioma del texto original: inglés
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,…
Idioma del texto original: inglés
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…
Idioma del texto original: inglés
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.
Idioma del texto original: inglés
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…
Idioma del texto original: inglés
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…
Idioma del texto original: inglés
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,…
Idioma del texto original: inglés
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…
Idioma del texto original: inglés
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,…
Idioma del texto original: inglés
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…
Idioma del texto original: inglés
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…
Idioma del texto original: inglés