{"id":"3f4b5795-9801-4308-b1b7-5d0cdbe2ac28","shortId":"jsZBmQ","kind":"skill","title":"fantasy","tagline":"Game-inspired fantasy aesthetic with bold, premium visuals, rich color palettes, and immersive thematic elements.","description":"<!-- TYPEUI_SH_MANAGED_START -->\n# Fantasy Design System Skill (Universal)\n\n## Mission\nYou are an expert design-system guideline author for fantasy.\nCreate practical, implementation-ready guidance that can be directly used by engineers and designers.\n\n## Brand\nthe best game in the world\n\n## Style Foundations\n- Visual style: bold, premium\n- Typography scale: 12/14/16/20/24/32 | Fonts: primary=New Rocker, display=New Rocker, mono=IBM Plex Mono | weights=100, 200, 300, 400, 500, 600, 700, 800, 900\n- Color palette: primary, secondary, success, warning, danger, info | Tokens: primary=#0250CC, secondary=#FDC800, success=#16A34A, warning=#D97706, danger=#DC2626, surface=#FFFFFF, text=#111827\n- Spacing scale: 8pt baseline grid\n\n\n## Accessibility\nWCAG 2.2 AA, keyboard-first interactions, visible focus states\n\n## Writing Tone\nconcise, confident, helpful\n\n## Rules: Do\n- prefer semantic tokens over raw values\n- preserve visual hierarchy\n- keep interaction states explicit\n\n## Rules: Don't\n- avoid low contrast text\n- avoid inconsistent spacing rhythm\n- avoid ambiguous labels\n\n## Expected Behavior\n- Follow the foundations first, then component consistency.\n- When uncertain, prioritize accessibility and clarity over novelty.\n- Provide concrete defaults and explain trade-offs when alternatives are possible.\n- Keep guidance opinionated, concise, and implementation-focused.\n\n## Guideline Authoring Workflow\n1. Restate the design intent in one sentence before proposing rules.\n2. Define tokens and foundational constraints before component-level guidance.\n3. Specify component anatomy, states, variants, and interaction behavior.\n4. Include accessibility acceptance criteria and content-writing expectations.\n5. Add anti-patterns and migration notes for existing inconsistent UI.\n6. End with a QA checklist that can be executed in code review.\n\n## Required Output Structure\nWhen generating design-system guidance, use this structure:\n- Context and goals\n- Design tokens and foundations\n- Component-level rules (anatomy, variants, states, responsive behavior)\n- Accessibility requirements and testable acceptance criteria\n- Content and tone standards with examples\n- Anti-patterns and prohibited implementations\n- QA checklist\n\n## Component Rule Expectations\n- Define required states: default, hover, focus-visible, active, disabled, loading, error (as relevant).\n- Describe interaction behavior for keyboard, pointer, and touch.\n- State spacing, typography, and color-token usage explicitly.\n- Include responsive behavior and edge cases (long labels, empty states, overflow).\n\n## Quality Gates\n- No rule should depend on ambiguous adjectives alone; anchor each rule to a token, threshold, or example.\n- Every accessibility statement must be testable in implementation.\n- Prefer system consistency over one-off local optimizations.\n- Flag conflicts between aesthetics and accessibility, then prioritize accessibility.\n\n## Example Constraint Language\n- Use \"must\" for non-negotiable rules and \"should\" for recommendations.\n- Pair every do-rule with at least one concrete don't-example.\n- If introducing a new pattern, include migration guidance for existing components.\n\n<!-- TYPEUI_SH_MANAGED_END -->","tags":["fantasy","awesome","design","skills","bergside","agent-skills","agentic-ai","agentic-workflow","agents","ai-agents","ai-tools","awesome-list"],"capabilities":["skill","source-bergside","skill-fantasy","topic-agent-skills","topic-agentic-ai","topic-agentic-workflow","topic-agents","topic-ai-agents","topic-ai-tools","topic-awesome","topic-awesome-list","topic-awesome-readme","topic-claude-design","topic-codex","topic-cursor"],"categories":["awesome-design-skills"],"synonyms":[],"warnings":[],"endpointUrl":"https://skills.sh/bergside/awesome-design-skills/fantasy","protocol":"skill","transport":"skills-sh","auth":{"type":"none","details":{"cli":"npx skills add bergside/awesome-design-skills","source_repo":"https://github.com/bergside/awesome-design-skills","install_from":"skills.sh"}},"qualityScore":"0.589","qualityRationale":"deterministic score 0.59 from registry signals: · indexed on github topic:agent-skills · 277 github stars · SKILL.md body (3,202 chars)","verified":false,"liveness":"unknown","lastLivenessCheck":null,"agentReviews":{"count":0,"score_avg":null,"cost_usd_avg":null,"success_rate":null,"latency_p50_ms":null,"narrative_summary":null,"summary_updated_at":null},"enrichmentModel":"deterministic:skill-github:v1","enrichmentVersion":1,"enrichedAt":"2026-05-02T12:53:53.500Z","embedding":null,"createdAt":"2026-04-18T22:11:22.848Z","updatedAt":"2026-05-02T12:53:53.500Z","lastSeenAt":"2026-05-02T12:53:53.500Z","tsv":"'0250cc':97 '1':200 '100':78 '111827':109 '12/14/16/20/24/32':65 '16a34a':101 '2':211 '2.2':117 '200':79 '3':222 '300':80 '4':231 '400':81 '5':241 '500':82 '6':253 '600':83 '700':84 '800':85 '8pt':112 '900':86 'aa':118 'accept':234,298 'access':115,172,233,294,379,400,403 'activ':325 'add':242 'adject':367 'aesthet':6,398 'alon':368 'altern':186 'ambigu':158,366 'anatomi':225,289 'anchor':369 'anti':244,307 'anti-pattern':243,306 'author':32,198 'avoid':149,153,157 'baselin':113 'behavior':161,230,293,333,350 'best':52 'bold':8,61 'brand':50 'case':353 'checklist':258,313 'clariti':174 'code':264 'color':12,87,344 'color-token':343 'compon':167,219,224,286,314,442 'component-level':218,285 'concis':128,192 'concret':178,427 'confid':129 'conflict':396 'consist':168,388 'constraint':216,405 'content':238,300 'content-writ':237 'context':278 'contrast':151 'creat':35 'criteria':235,299 'd97706':103 'danger':93,104 'dc2626':105 'default':179,320 'defin':212,317 'depend':364 'describ':331 'design':19,29,49,203,272,281 'design-system':28,271 'direct':44 'disabl':326 'display':70 'do-rul':420 'edg':352 'element':17 'empti':356 'end':254 'engin':47 'error':328 'everi':378,419 'exampl':305,377,404,431 'execut':262 'exist':250,441 'expect':160,240,316 'expert':27 'explain':181 'explicit':145,347 'fantasi':1,5,18,34 'fdc800':99 'ffffff':107 'first':121,165 'flag':395 'focus':124,196,323 'focus-vis':322 'follow':162 'font':66 'foundat':58,164,215,284 'game':3,53 'game-inspir':2 'gate':360 'generat':270 'goal':280 'grid':114 'guidanc':40,190,221,274,439 'guidelin':31,197 'help':130 'hierarchi':141 'hover':321 'ibm':74 'immers':15 'implement':38,195,311,385 'implementation-focus':194 'implementation-readi':37 'includ':232,348,437 'inconsist':154,251 'info':94 'inspir':4 'intent':204 'interact':122,143,229,332 'introduc':433 'keep':142,189 'keyboard':120,335 'keyboard-first':119 'label':159,355 'languag':406 'least':425 'level':220,287 'load':327 'local':393 'long':354 'low':150 'migrat':247,438 'mission':23 'mono':73,76 'must':381,408 'negoti':412 'new':68,71,435 'non':411 'non-negoti':410 'note':248 'novelti':176 'off':184 'one':206,391,426 'one-off':390 'opinion':191 'optim':394 'output':267 'overflow':358 'pair':418 'palett':13,88 'pattern':245,308,436 'plex':75 'pointer':336 'possibl':188 'practic':36 'prefer':133,386 'premium':9,62 'preserv':139 'primari':67,89,96 'priorit':171,402 'prohibit':310 'propos':209 'provid':177 'qa':257,312 'qualiti':359 'raw':137 'readi':39 'recommend':417 'relev':330 'requir':266,295,318 'respons':292,349 'restat':201 'review':265 'rhythm':156 'rich':11 'rocker':69,72 'rule':131,146,210,288,315,362,371,413,422 'scale':64,111 'secondari':90,98 'semant':134 'sentenc':207 'skill':21 'skill-fantasy' 'source-bergside' 'space':110,155,340 'specifi':223 'standard':303 'state':125,144,226,291,319,339,357 'statement':380 'structur':268,277 'style':57,60 'success':91,100 'surfac':106 'system':20,30,273,387 't-exampl':429 'testabl':297,383 'text':108,152 'themat':16 'threshold':375 'token':95,135,213,282,345,374 'tone':127,302 'topic-agent-skills' 'topic-agentic-ai' 'topic-agentic-workflow' 'topic-agents' 'topic-ai-agents' 'topic-ai-tools' 'topic-awesome' 'topic-awesome-list' 'topic-awesome-readme' 'topic-claude-design' 'topic-codex' 'topic-cursor' 'touch':338 'trade':183 'trade-off':182 'typographi':63,341 'ui':252 'uncertain':170 'univers':22 'usag':346 'use':45,275,407 'valu':138 'variant':227,290 'visibl':123,324 'visual':10,59,140 'warn':92,102 'wcag':116 'weight':77 'workflow':199 'world':56 'write':126,239","prices":[{"id":"e60f1ab4-11b6-416a-aa8f-08c5ed043d4a","listingId":"3f4b5795-9801-4308-b1b7-5d0cdbe2ac28","amountUsd":"0","unit":"free","nativeCurrency":null,"nativeAmount":null,"chain":null,"payTo":null,"paymentMethod":"skill-free","isPrimary":true,"details":{"org":"bergside","category":"awesome-design-skills","install_from":"skills.sh"},"createdAt":"2026-04-18T22:11:22.848Z"}],"sources":[{"listingId":"3f4b5795-9801-4308-b1b7-5d0cdbe2ac28","source":"github","sourceId":"bergside/awesome-design-skills/fantasy","sourceUrl":"https://github.com/bergside/awesome-design-skills/tree/main/skills/fantasy","isPrimary":false,"firstSeenAt":"2026-04-18T22:11:22.848Z","lastSeenAt":"2026-05-02T12:53:53.500Z"}],"details":{"listingId":"3f4b5795-9801-4308-b1b7-5d0cdbe2ac28","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"bergside","slug":"fantasy","github":{"repo":"bergside/awesome-design-skills","stars":277,"topics":["agent-skills","agentic-ai","agentic-workflow","agents","ai","ai-agents","ai-tools","awesome","awesome-list","awesome-readme","claude-design","codex","cursor","design","design-md","design-system","google-stitch","skills"],"license":"mit","html_url":"https://github.com/bergside/awesome-design-skills","pushed_at":"2026-05-01T09:16:36Z","description":"List of awesome DESIGN.md and SKILL.md design skill files for agentic tools like Claude Design, Google Stitch, Codex, Cursor, and other AI tools","skill_md_sha":"00b65de36f108f0af248a2a224ca379fa0101d0a","skill_md_path":"skills/fantasy/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/bergside/awesome-design-skills/tree/main/skills/fantasy"},"layout":"multi","source":"github","category":"awesome-design-skills","frontmatter":{"name":"fantasy","license":"MIT","description":"Game-inspired fantasy aesthetic with bold, premium visuals, rich color palettes, and immersive thematic elements."},"skills_sh_url":"https://skills.sh/bergside/awesome-design-skills/fantasy"},"updatedAt":"2026-05-02T12:53:53.500Z"}}