skills.rest
jbreel77888
jbreel77888COMMUNITY
Explore all skills by this author →
GitHub

artistic

Generates implementation-ready design-system guidelines using the Artistic high-contrast visual style.

Updated Jun 20, 2026
Search Tags:#typography#accessibility#WCAG#design system#color palette#design tokens#UI guidelines
One-click install
npx skills add https://github.com/jbreel77888/Ai-Agnet --skill artistic-jbreel77888
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: artistic
Source: https://github.com/jbreel77888/Ai-Agnet/tree/main/skills/design/design-systems/style-skills/artistic
Command: npx skills add https://github.com/jbreel77888/Ai-Agnet --skill artistic-jbreel77888

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Teams building visually striking interfaces often lack consistent, opinionated design-system rules, leading to inconsistent spacing, low-contrast text, and inaccessible components. This Skill provides a complete Artistic style foundation with tokens, rules, and QA checklists. ## Core Features & Use Cases - Design Token Foundations: Defines color tokens (primary #3B82F6, secondary #8B5CF6, semantic states), typography scales (Limelight and JetBrains Mono), and spacing scales (4/8/12/16/24/32). - Component Rule Authoring: Produces component anatomy, variants, states (hover, focus-visible, disabled, loading, error), and responsive behavior guidance. - Accessibility Enforcement: Embeds WCAG 2.2 AA requirements, keyboard-first interactions, and testable acceptance criteria into every guideline. - Use Case: A designer asks for button component rules; the Skill outputs token-anchored anatomy, interaction states, anti-patterns, and a code-review QA checklist. ## Quick Start Generate design-system guidelines for a card component following the Artistic style with accessibility acceptance criteria.

Frequently Asked Questions about artistic

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create design-system guidelines for a high-contrast UI style?▼

Define foundational tokens first (colors, typography scale, spacing), then specify component anatomy, states, and variants. This Skill enforces that workflow and outputs rules anchored to tokens rather than ambiguous adjectives.

What color and typography tokens does the Artistic style use?▼

The Artistic style uses primary #3B82F6, secondary #8B5CF6, success #16A34A, warning #D97706, and danger #DC2626. Typography uses Limelight for headings and body with JetBrains Mono for labels, on a 12/14/16/18/24/30/36 scale.

Does this design system support WCAG accessibility requirements?▼

Yes, the guidelines mandate WCAG 2.2 AA compliance, keyboard-first interactions, visible focus states, 44px touch targets, and reduced-motion support. Every accessibility statement must be testable in implementation.

What output structure do the generated design guidelines follow?▼

Output includes context and goals, design tokens, component-level rules with states and responsive behavior, accessibility acceptance criteria, content tone standards, anti-patterns, and a QA checklist for code review.

When should I not use a high-contrast artistic design style?▼

Avoid it for content-dense enterprise tools where expressive typography reduces scannability, or brands requiring subdued palettes. The Skill itself flags conflicts between aesthetics and accessibility, prioritizing accessibility.

Related Skills

Explore More Design & Creative Skills→
EveryIncEveryInc
28

Archetyping

Define brand character and audience archetypes for psychological coherence.

Official
Intermediate
aadilmallickaadilmallick

gluestack-ui-v5:validation

Validates gluestack-ui v5 React Native code against styling and component anti-patterns.

Community
Intermediate
mahg-esmahg-es
3

accessibility

Audit web and mobile interfaces for WCAG 2.2 AA accessibility violations.

Official
Intermediate
MediaAskeyDOJOMediaAskeyDOJO

tailwind-design-system

Build scalable Tailwind CSS design systems with design tokens and CVA variants.

Community
Advanced