{"id":"1910d5d7-d9c5-4a27-b7b6-27fb63bf1eae","shortId":"9Z6ujR","kind":"skill","title":"impeccable","tagline":"A modern, graphic, editorial-poster aesthetic — warm and confident — built on alternating cream and burnt orange sections, an amber brand color.","description":"<!-- TYPEUI_SH_MANAGED_START -->\n# Impeccable Design System Skill (Universal)\n\n## Mission\nYou are an expert design-system guideline author for Impeccable.\nCreate practical, implementation-ready guidance that can be directly used by engineers and designers.\n\n## Brand\nA modern, graphic, editorial-poster aesthetic — warm and confident — built on alternating cream and burnt orange sections, an amber brand color.\n\n## Style Foundations\n- Visual style: modern, clean, high-contrast\n- Typography scale: 12/14/16/20/24/32 | Fonts: primary=Chakra Petch, display=Chakra Petch, mono=JetBrains Mono | weights=100, 200, 300, 400, 500, 600, 700, 800, 900\n- Color palette: primary, neutral, success, warning, danger | Tokens: primary=#CC8800, secondary=#C55221, success=#16A34A, warning=#D97706, danger=#DC2626, surface=#FFFFFF, text=#111827\n- Spacing scale: 4/8/12/16/24/32\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":["impeccable","awesome","design","skills","bergside","agent-skills","agentic-ai","agentic-workflow","agents","ai-agents","ai-tools","awesome-list"],"capabilities":["skill","source-bergside","skill-impeccable","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/impeccable","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.700","qualityRationale":"deterministic score 0.70 from registry signals: · indexed on github topic:agent-skills · 826 github stars · SKILL.md body (3,335 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-18T18:53:22.407Z","embedding":null,"createdAt":"2026-05-06T12:54:22.125Z","updatedAt":"2026-05-18T18:53:22.407Z","lastSeenAt":"2026-05-18T18:53:22.407Z","tsv":"'1':221 '100':102 '111827':132 '12/14/16/20/24/32':90 '16a34a':124 '2':232 '2.2':138 '200':103 '3':243 '300':104 '4':252 '4/8/12/16/24/32':135 '400':105 '5':262 '500':106 '6':274 '600':107 '700':108 '800':109 '900':110 'aa':139 'accept':255,319 'access':136,193,254,315,400,421,424 'activ':346 'add':263 'adject':388 'aesthet':8,63,419 'alon':389 'altern':14,69,207 'amber':21,76 'ambigu':179,387 'anatomi':246,310 'anchor':390 'anti':265,328 'anti-pattern':264,327 'author':38,219 'avoid':170,174,178 'behavior':182,251,314,354,371 'brand':22,56,77 'built':12,67 'burnt':17,72 'c55221':122 'case':374 'cc8800':120 'chakra':93,96 'checklist':279,334 'clariti':195 'clean':84 'code':285 'color':23,78,111,365 'color-token':364 'compon':188,240,245,307,335,463 'component-level':239,306 'concis':149,213 'concret':199,448 'confid':11,66,150 'conflict':417 'consist':189,409 'constraint':237,426 'content':259,321 'content-writ':258 'context':299 'contrast':87,172 'cream':15,70 'creat':41 'criteria':256,320 'd97706':126 'danger':117,127 'dc2626':128 'default':200,341 'defin':233,338 'depend':385 'describ':352 'design':25,35,55,224,293,302 'design-system':34,292 'direct':50 'disabl':347 'display':95 'do-rul':441 'edg':373 'editori':6,61 'editorial-post':5,60 'empti':377 'end':275 'engin':53 'error':349 'everi':399,440 'exampl':326,398,425,452 'execut':283 'exist':271,462 'expect':181,261,337 'expert':33 'explain':202 'explicit':166,368 'ffffff':130 'first':142,186 'flag':416 'focus':145,217,344 'focus-vis':343 'follow':183 'font':91 'foundat':80,185,236,305 'gate':381 'generat':291 'goal':301 'graphic':4,59 'guidanc':46,211,242,295,460 'guidelin':37,218 'help':151 'hierarchi':162 'high':86 'high-contrast':85 'hover':342 'impecc':1,24,40 'implement':44,216,332,406 'implementation-focus':215 'implementation-readi':43 'includ':253,369,458 'inconsist':175,272 'intent':225 'interact':143,164,250,353 'introduc':454 'jetbrain':99 'keep':163,210 'keyboard':141,356 'keyboard-first':140 'label':180,376 'languag':427 'least':446 'level':241,308 'load':348 'local':414 'long':375 'low':171 'migrat':268,459 'mission':29 'modern':3,58,83 'mono':98,100 'must':402,429 'negoti':433 'neutral':114 'new':456 'non':432 'non-negoti':431 'note':269 'novelti':197 'off':205 'one':227,412,447 'one-off':411 'opinion':212 'optim':415 'orang':18,73 'output':288 'overflow':379 'pair':439 'palett':112 'pattern':266,329,457 'petch':94,97 'pointer':357 'possibl':209 'poster':7,62 'practic':42 'prefer':154,407 'preserv':160 'primari':92,113,119 'priorit':192,423 'prohibit':331 'propos':230 'provid':198 'qa':278,333 'qualiti':380 'raw':158 'readi':45 'recommend':438 'relev':351 'requir':287,316,339 'respons':313,370 'restat':222 'review':286 'rhythm':177 'rule':152,167,231,309,336,383,392,434,443 'scale':89,134 'secondari':121 'section':19,74 'semant':155 'sentenc':228 'skill':27 'skill-impeccable' 'source-bergside' 'space':133,176,361 'specifi':244 'standard':324 'state':146,165,247,312,340,360,378 'statement':401 'structur':289,298 'style':79,82 'success':115,123 'surfac':129 'system':26,36,294,408 't-exampl':450 'testabl':318,404 'text':131,173 'threshold':396 'token':118,156,234,303,366,395 'tone':148,323 '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':359 'trade':204 'trade-off':203 'typographi':88,362 'ui':273 'uncertain':191 'univers':28 'usag':367 'use':51,296,428 'valu':159 'variant':248,311 'visibl':144,345 'visual':81,161 'warm':9,64 'warn':116,125 'wcag':137 'weight':101 'workflow':220 'write':147,260","prices":[{"id":"02c66be1-290c-4e59-9e5f-97a1f9081f1e","listingId":"1910d5d7-d9c5-4a27-b7b6-27fb63bf1eae","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-05-06T12:54:22.125Z"}],"sources":[{"listingId":"1910d5d7-d9c5-4a27-b7b6-27fb63bf1eae","source":"github","sourceId":"bergside/awesome-design-skills/impeccable","sourceUrl":"https://github.com/bergside/awesome-design-skills/tree/main/skills/impeccable","isPrimary":false,"firstSeenAt":"2026-05-06T12:54:22.125Z","lastSeenAt":"2026-05-18T18:53:22.407Z"}],"details":{"listingId":"1910d5d7-d9c5-4a27-b7b6-27fb63bf1eae","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"bergside","slug":"impeccable","github":{"repo":"bergside/awesome-design-skills","stars":826,"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-06T18:26:50Z","description":"List of 67 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":"27009d1a1b0188397f796b7b0ea0cd48f57e47f4","skill_md_path":"skills/impeccable/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/bergside/awesome-design-skills/tree/main/skills/impeccable"},"layout":"multi","source":"github","category":"awesome-design-skills","frontmatter":{"name":"impeccable","description":"A modern, graphic, editorial-poster aesthetic — warm and confident — built on alternating cream and burnt orange sections, an amber brand color."},"skills_sh_url":"https://skills.sh/bergside/awesome-design-skills/impeccable"},"updatedAt":"2026-05-18T18:53:22.407Z"}}