LogoClawIndex
CasesSkillsAbout
LogoClawIndex

ClawIndex

OpenClaw Skills & Use Case Index

ClawIndex is an ecosystem-driven index of OpenClaw skills and real-world use cases.

Index

Skills·
Cases

Meta

About·
Disclaimer·
Email·
GitHub
© 2026 ClawIndex All Rights Reserved.

Skills tagged: react

Browse skills that share this tag.

  • avoid-ai-design - Audit and rewrite frontend UI to remove AI design patterns
    designuifrontendai-slop

    ★ 79 · Updated 2026-09-22

    Audits and rewrites HTML/CSS and React/Tailwind frontend UI to eliminate generic AI design patterns, with support for audit-only mode.

    ⚙ Audit frontend code for AI patterns⚙ Render UI previews when available⚙ Commit to unified design directions
  • tauri2-react-rust - Tauri 2, React, and Rust App Development
    tauri2reactrusttypescript

    ★ 0 · Updated 2026-09-22

    Guides cross-platform desktop app development using Tauri 2, React, and Rust, including IPC design, state management, and browser-based verification.

    ⚙ Design Tauri app architecture⚙ Implement IPC command communication⚙ Write Rust backend commands
  • frontend-architecture-planner - Plan frontend architecture through structured questioning.
    frontendarchitectureplanningreact

    ★ 0 · Updated 2026-09-22

    Clarifies product scope, UI patterns, component architecture, state management, and engineering constraints before code implementation.

    ⚙ Ask structured architectural questions⚙ Summarize architectural decisions⚙ Recommend frontend technology stacks
  • clean-code - Clean code guidelines for React/JavaScript projects
    reactjavascriptclean-codelucide-icons

    ★ 1 · Updated 2026-09-22

    Provides clean code guidelines, component structures, and naming conventions for React and JavaScript projects using Lucide icons.

    ⚙ Provide React component structures⚙ Define naming conventions⚙ Standardize props patterns
  • remotion-best-practices - Remotion Best Practices for React Video Creation
    remotionvideoreactanimation

    ★ 0 · Updated 2026-09-22

    Provides domain-specific knowledge and best practices for creating animations, compositions, and videos using Remotion in React.

    ⚙ Scaffold new Remotion project⚙ Design video animations and compositions⚙ Preview videos in Remotion Studio
  • react-best-practices - Next.js & React Performance Expert
    reactnextjsperformanceoptimization

    ★ 0 · Updated 2026-09-22

    Provides Next.js and React performance optimization guidelines from Vercel Engineering.

    ⚙ Eliminate data fetching waterfalls⚙ Optimize bundle size⚙ Optimize server side performance
  • withseismic-grid - Layout system for web pages using a twelve-unit grid
    withseismicgridlayoutreact

    ★ 0 · Updated 2026-09-22

    Builds web page layouts and UIs using @withseismic/grid components based on arithmetic grid rules and ladder fractions.

    ⚙ Install @withseismic/grid layout package⚙ Render grid layout primitives⚙ Compose page movements and rows
  • spirit:figma-to-code - Convert Figma designs into React with Spirit Web React
    figmareactspirit-web-reactdesign-to-code

    ★ 26 · Updated 2026-09-22

    Implement production React UI from a Figma design using @alma-oss/spirit-web-react.

    ⚙ Acquire Figma design context⚙ Map design to Spirit components⚙ Apply responsive layout breakpoints
  • next-cache-components - Configure Next.js 16 Cache Components and PPR
    nextjscachingpprreact

    ★ 0 · Updated 2026-09-21

    Configure Partial Prerendering and caching directives including use cache, cacheLife, cacheTag, and updateTag in Next.js 16+.

    ⚙ Enable Cache Components in config⚙ Configure cache life with cacheLife⚙ Tag cache entries using cacheTag
  • desktop-tauri-scaffold - Scaffold a Tauri v2 Desktop Application
    tauritauri-v2desktopscaffold

    ★ 1 · Updated 2026-09-21

    Creates a Tauri v2 desktop application scaffold with default-deny security, strict CSP, updater config, and CI workflow.

    ⚙ Generate project using create-tauri-app⚙ Configure strict Content Security Policy⚙ Set up window capability files
  • web-frameworks - Build Web Applications with Next.js and Turborepo
    nextjsturboreporemixiconmonorepo

    ★ 602 · Updated 2026-09-21

    Provides guides and patterns for building web applications using Next.js, Turborepo monorepos, and RemixIcon.

    ⚙ Build full-stack web applications⚙ Set up Turborepo monorepos⚙ Implement server-side rendering
  • React Frontend Development - Build React components for Medellin Spark platform
    reacttypescripttailwind-cssreact-query

    ★ 18 · Updated 2026-09-21

    Build React components with TypeScript, Tailwind CSS, and React Query for the Medellin Spark platform.

    ⚙ Build React UI components⚙ Manage state with React Query⚙ Integrate Supabase database queries
  • buildpad-reference - Buildpad UI Component Catalog and Usage Reference
    buildpadui-componentsmantinereact

    ★ 0 · Updated 2026-09-21

    Provides a catalog of 40+ Buildpad UI components, hooks, services, and enforces Buildpad-First usage rules.

    ⚙ Enforce Buildpad component usage rules⚙ Reference Buildpad UI components and hooks⚙ Guide CollectionForm and CollectionList usage
  • performance-security - React performance, accessibility, and security patterns
    reactperformanceaccessibilitysecurity

    ★ 18 · Updated 2026-09-21

    Provides best practices and checklists for code-splitting, React Compiler, asset optimization, a11y, and security hardening.

    ⚙ Implement route-level code-splitting⚙ Optimize React compiler performance⚙ Optimize images and static assets
  • formik-patterns - Formik form handling and validation patterns
    formikreactyupform-validation

    ★ 602 · Updated 2026-09-21

    Provides patterns for Formik form handling, Yup validation schemas, field helpers, and submission flow.

    ⚙ Set up basic Formik forms⚙ Create Yup validation schemas⚙ Handle conditional form validation
  • tanstack-query-expert - TanStack Query expert for React and Next.js state management
    tanstack-queryreact-queryreactnextjs

    ★ 0 · Updated 2026-09-20

    Provides asynchronous state management, declarative data fetching, cache invalidation, optimistic UI updates, and Next.js App Router integration patterns.

    ⚙ Fetch asynchronous data declaratively⚙ Design array-based query key factories⚙ Configure stale time and retry rules
  • zustand - State management in React with Zustand v5
    reactzustandstate-managementtypescript

    ★ 0 · Updated 2026-09-20

    Provides patterns and instructions for global client-side state management, slices, middleware, and React 19 SSR integration using Zustand v5.

    ⚙ Create React state stores⚙ Implement domain state slices⚙ Configure Zustand middleware
  • senior-qa - Senior QA Engineer
    testingqareactnextjs

    ★ 1 · Updated 2026-09-20

    Generates tests, analyzes coverage reports, and scaffolds Playwright E2E tests for React and Next.js applications.

    ⚙ Generate Jest test stubs⚙ Analyze test coverage reports⚙ Scaffold Playwright E2E tests
  • remotion - Programmatic video creation with React
    remotionreactvideo-renderinganimation

    ★ 9 · Updated 2026-09-20

    Provides rules and code patterns for programmatic video creation, animation, composition, and rendering using Remotion and React.

    ⚙ Build video compositions with React⚙ Render videos using CLI options⚙ Animate elements using spring physics
  • framer-motion-animations - Framer Motion Animation Implementation
    framer-motionreactanimationfrontend

    ★ 602 · Updated 2026-09-20

    Implement scroll-triggered, entrance, and staggered list animations using Framer Motion with reduced motion support.

    ⚙ Create scroll-triggered reveal animations⚙ Implement entrance animations⚙ Create staggered list animations

Scroll to load more