🎯

8-bit-pixel-art-patterns

🎯Skill

from theorcdev/8bitcn-ui

What it does

Creates pixelated borders, shadows, and effects for authentic 8-bit retro UI components using absolute-positioned div patterns.

📦

Same repository

theorcdev/8bitcn-ui(23 items)

8-bit-pixel-art-patterns

Installation

Vibe Index InstallInstalls to .claude/skills/ - auto-recognized by Claude Code

npx vibeindex add theorcdev/8bitcn-ui --skill 8-bit-pixel-art-patterns

skills.sh Install⚠ Installs to .agents/skills/ - may not be auto-recognized by Claude Code

npx skills add theorcdev/8bitcn-ui --skill 8-bit-pixel-art-patterns

Manual InstallCopy SKILL.md content and save to the path below

~/.claude/skills/8-bit-pixel-art-patterns/SKILL.md

SKILL.md

67Installs

1,576

Last UpdatedJan 22, 2026

View on GitHub Back to Skills

More from this repository10

🎯

fumadocs-mdx-structure🎯Skill

Creates MDX documentation files with proper frontmatter, imports, and component integration for Fumadocs pages in the 8-bit CN UI component library

🎯

rendering-animate-svg🎯Skill

Skills for building 8-bit retro UI components with pixel art animations, providing guidance on hardware-accelerated SVG animation techniques for retro-styled interfaces.

🎯

fumadocs-component-docs🎯Skill

Creates component documentation with installation guides, usage examples, and preview sections for 8-bit styled UI components.

🎯

fumadocs-registry-integration🎯Skill

Skills for building 8-bit retro UI components with pixel art animations, providing guidance on hardware-accelerated SVG animation techniques for retro-styled interfaces.

🎯

retro-css-architecture🎯Skill

A retro CSS architecture skill from 8bitcn-ui for organizing 8-bit styled CSS with custom properties, pixel fonts, responsive pixel art, and dark mode support.

🎯

gaming-ui-state-management🎯Skill

Provides patterns for building RPG/retro game-like interfaces with state-driven visuals including health bars, XP bars, and mana bars using 8bitcn-ui components.

🎯

bundle-barrel-imports🎯Skill

Instructs developers to import directly from source files instead of barrel files when using libraries like lucide-react, @mui/material, or @radix-ui/react-* to reduce bundle size and improve dev boot time.

🎯

animation-performance-retro🎯Skill

Optimizes 8-bit animations for smooth pixel art rendering, game UI effects, and retro-styled animations in the 8bitcn-ui component library.

🎯

8bit-docs-patterns🎯Skill

Generates retro-styled, gaming-themed documentation with 8-bit terminology, realistic game data examples, and pixel font styling for UI components.

🎯

registry-component-patterns🎯Skill

Guides registering components in registry.json for the shadcn/ui add command, specifically designed for adding new 8-bit styled components to the 8bitcn-ui component library.