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: styling

Browse skills that share this tag.

  • ecc-frontend-design - Create distinctive, production-grade frontend interfaces.
    frontendui-designstylinglayout

    ★ 0 · Updated 2026-09-23

    Generates creative, polished frontend interface code that avoids generic AI aesthetics for web components, pages, artifacts, posters, or applications.

    ⚙ Build web components⚙ Build web pages⚙ Build web applications
  • rn-styling - React Native Styling with NativeWind and BrandColors
    react-nativeexponativewindstyling

    ★ 422 · Updated 2026-09-20

    Provides styling patterns for React Native using NativeWind for layout utilities and BrandColors for semantic theme colors.

    ⚙ Apply hybrid styling patterns⚙ Implement theme-aware color switching⚙ Configure platform-specific UI styles
  • demo-ui-tokens - Monochrome design system CSS tokens reference for demo UI
    cssdesign-systemui-tokensstyling

    ★ 37 · Updated 2026-09-19

    Provides complete CSS custom property token reference for colors, spacing, typography, and layout in demo UI styling.

    ⚙ Reference color tokens⚙ Reference spacing increments⚙ Reference typography specifications
  • Maple CSS Engine - Variable-first runtime CSS engine for user interfaces
    cssstylingmaple-cssresponsive-design

    ★ 34 · Updated 2026-09-18

    Guides AI assistants to write responsive interface styles using Maple CSS engine syntax and reference documentation.

    ⚙ Read Maple reference documentation⚙ Compose Maple utility class names⚙ Define scoped CSS variable tokens
  • bolder - Amplify safe or boring designs to increase visual impact
    designuifrontendtypography

    ★ 0 · Updated 2026-09-18

    Amplifies safe or boring designs to create distinct, high-impact user experiences while preserving functionality and accessibility.

    ⚙ Gather brand context and audience⚙ Assess visual weakness sources⚙ Plan distinct amplification strategy
  • bolder - Amplify safe or boring designs for higher visual impact
    ui-designvisual-designfrontendstyling

    ★ 0 · Updated 2026-09-18

    Amplifies safe or generic designs to create more engaging and memorable experiences while maintaining usability.

    ⚙ Gather target context and audience guidelines⚙ Assess design weaknesses and current state⚙ Plan visual amplification and focal points
  • bolder - Amplify designs to increase visual impact and personality.
    ui-designvisual-designstylingtypography

    ★ 1 · Updated 2026-09-17

    Amplifies safe, generic, or boring designs to increase visual impact and personality while maintaining usability, performance, and accessibility standards.

    ⚙ Assess current design weaknesses⚙ Plan design amplification strategy⚙ Amplify typography scale and contrast
  • colorize - Strategically introduce color to monochromatic or dull designs
    ui-designfrontendcolor-palettestyling

    ★ 0 · Updated 2026-09-17

    Add strategic color to monochromatic UI features to enhance visual hierarchy, engagement, and semantic meaning.

    ⚙ Assess current color opportunities⚙ Plan color palette and strategy⚙ Apply semantic status colors
  • ui-styling-assistant - Universal Design System UI styling assistant
    cssstylingdesign-tokenstailwind

    ★ 3 · Updated 2026-09-17

    Provides CSS snippets using Universal Design System tokens with dark mode variants, responsive breakpoints, and framework output support.

    ⚙ Generate CSS code snippets⚙ Provide Universal Design System tokens⚙ Output Tailwind CSS utility classes
  • typeset - Improve font choices, hierarchy, and text readability
    typographyfont-selectiontext-hierarchyreadability

    ★ 1 · Updated 2026-09-16

    Improves typography by fixing font choices, hierarchy, sizing, weight, and readability.

    ⚙ Assess typography weaknesses⚙ Plan systematic typography improvements⚙ Select appropriate brand fonts
  • apply-shadcn - Apply shadcn/ui components to React pages with custom themes
    reactshadcn-uistylingtheme-integration

    ★ 602 · Updated 2026-09-14

    Applies shadcn/ui components to React pages and components while integrating with custom theme CSS variables.

    ⚙ Create styling todo list⚙ Install required shadcn components⚙ Fetch component usage examples
  • tailwindcss-development - Tailwind CSS Development
    tailwindcsscssstylingresponsive-design

    ★ 1 · Updated 2026-09-13

    Styles applications using Tailwind CSS v4 utilities and guides responsive design, dark mode, layout, and component styling.

    ⚙ Add styles to components or pages⚙ Implement responsive design⚙ Implement dark mode
  • theme-factory - Apply pre-set or custom themes to artifacts
    typescriptmlthemesstyling

    ★ 0 · Updated 2026-09-12

    Applies font and color themes to artifacts using 10 pre-set options or custom generated themes.

    ⚙ Display theme showcase file⚙ Apply selected theme to artifacts⚙ Read specifications from themes directory
  • scss-module - CSS Modules style guide for neter-template React components
    reactscsscss-modulesclsx

    ★ 4 · Updated 2026-09-12

    Guides the creation and refactoring of React component styles in neter-template using CSS Modules, classes imports, and clsx.

    ⚙ Convert .scss to .module.scss⚙ Add scoped styles for TSX⚙ Refactor JSX class composition
  • brand-guidelines-community - Anthropic Brand Styling Guidelines
    brandinganthropictypographystyling

    ★ 0 · Updated 2026-09-11

    Provides access to Anthropic's official brand identity, typography, color palettes, and visual formatting rules.

    ⚙ Apply Poppins font to headings⚙ Apply Lora font to body⚙ Apply official brand colors
  • brand-guidelines - Anthropic Brand Styling
    brandingtypographystylingvisual-design

    ★ 1 · Updated 2026-09-11

    Applies Anthropic's official brand colors and typography to visual artifacts.

    ⚙ Apply Poppins font to headings⚙ Apply Lora font to body text⚙ Apply Anthropic colors to shapes
  • tailwindcss-effects - Tailwind CSS v4.1 Effects Utilities
    Tailwind CSSvisual effectsstylingCSS utilities

    ★ 27 · Updated 2026-06-30

    Add shadows, filters, masks and visual effects to elements

    ⚙ apply shadows⚙ set shadow colors⚙ apply inset shadows
  • ckm:ui-styling - UI Styling with shadcn/ui & Tailwind
    UIstylingcomponentsTailwind CSS

    ★ 7 · Updated 2026-06-30

    Create accessible UIs with shadcn/ui components, Tailwind CSS utility styling, and canvas-based visual designs

    ⚙ create UI components⚙ style interfaces⚙ build layouts
  • building-native-ui - Expo Router native UI guide
    exporeact nativemobile developmentnavigation

    ★ 23 · Updated 2026-06-30

    Complete guide for building apps with Expo Router covering fundamentals, styling, components, navigation, animations, and patterns

    ⚙ build Expo apps⚙ create routes⚙ style components
  • sc-create-slide-template - Create ScriptCast Slide Templates from Screenshots
    templatescriptcastslidestyling

    ★ 602 · Updated 2026-06-15

    Extract visual styling from screenshots to create reusable ScriptCast slide templates with validation

    ⚙ extract colors from screenshots⚙ extract fonts from screenshots⚙ extract spacing from screenshots

Scroll to load more