Toolverse
All skills

8-bit-pixel-art-patterns

by TheOrcDev

Create pixelated borders, shadows, and effects for 8-bit retro components. Apply when building 8-bit styled UI components that need authentic pixel art aesthetics.

Installation

Pick a client and clone the repository into its skills directory.

Installation

Quick info

Author
TheOrcDev
Category
Security
Views
3

About this skill

Create pixelated borders, shadows, and effects for 8-bit retro components. Apply when building 8-bit styled UI components that need authentic pixel art aesthetics.

How to use

  1. Zainstaluj skill w swoim projekcie Claude, dodając katalog 8-bit-pixel-art-patterns do konfiguracji umiejętności agenta.

  2. Gdy projektujesz komponent UI w stylu retro, poproś Claude o zastosowanie wzoru pixelowanego obramowania. Skill automatycznie wygeneruje strukturę 9 elementów div – cztery narożniki, cztery segmenty krawędzi oraz boki – każdy z odpowiednimi klasami Tailwind CSS do pozycjonowania i kolorowania.

  3. Dla komponentów wymagających głębi wizualnej, zastosuj wzór pixelowanego cienia. Skill doda warstwy cienia na górze i dole elementu, tworząc efekt 3D charakterystyczny dla grafiki 8-bitowej.

  4. Dostosuj rozmiary pikseli i kolory poprzez modyfikację klas CSS (size-1.5, bg-foreground) do swoich potrzeb projektowych – skill dostarcza szablon, który łatwo się skaluje.

  5. Łącz obramowania i cienie w jednym komponencie, aby uzyskać pełny retro efekt. Skill obsługuje warianty takie jak outline, pozwalając na warunkowe renderowanie efektów cienia.

  6. Testuj komponenty w przeglądarce – pixelowane elementy powinny wyrenderować się jako ostre, geometryczne kształty tworzące autentyczną estetykę pixel artu z lat 80. i 90.

Related skills

backend-security-coder

by sickn33

Expert in secure backend coding practices specializing in input validation, authentication, and API security. Use PROACTIVELY for backend security implementations or security code reviews.

Security
1133

security-compliance

by davila7

Guides security professionals in implementing defense-in-depth security architectures, achieving compliance with industry frameworks (SOC2, ISO27001, GDPR, HIPAA), conducting threat modeling and risk assessments, managing security operations and incident response, and embedding

Security
1172

python-expert

by Shubhamsaboo

Senior Python developer expertise for writing clean, efficient, and well-documented code.\nUse when: writing Python code, optimizing Python scripts, reviewing Python code for best practices,\ndebugging Python issues, implementing type hints, or when user mentions Python, PEP 8,

Security
2777

gmail-manager

by jeffvincent

Manage Gmail - send, read, search emails, manage labels and drafts. Use when user wants to interact with their Gmail account for email operations.

Security
17128

content-creator

by alirezarezvani

Create SEO-optimized marketing content with consistent brand voice. Includes brand voice analyzer, SEO optimizer, content frameworks, and social media templates. Use when writing blog posts, creating social media content, analyzing brand voice, optimizing SEO, planning content

Security
25124

google-analytics

by davila7

Analyze Google Analytics data, review website performance metrics, identify traffic patterns, and suggest data-driven improvements. Use when the user asks about analytics, website metrics, traffic analysis, conversion rates, user behavior, or performance optimization.

Security
1260