{"id":"4ef55226-bed6-46c1-bfce-9e147955d5b2","shortId":"H6z3xR","kind":"skill","title":"simple","tagline":"Straightforward, no-frills design with clean typography, neutral colors, and intuitive layouts that stay out of the way.","description":"<!-- TYPEUI_SH_MANAGED_START -->\n# Simple Design System Skill (Universal)\n\n## Mission\nYou are an expert design-system guideline author for Simple design.\nCreate practical, implementation-ready guidance that can be directly used by engineers and designers.\n\n## Brand\n\n\n## Style Foundations\n- Visual style: minimal, clean\n- Typography scale: 12/14/16/20/24/32 | Fonts: primary=Inter, display=Inter, mono=JetBrains Mono | weights=100, 200, 300, 400, 500, 600, 700, 800, 900\n- Color palette: primary, neutral, success, warning, danger | Tokens: primary=#3B82F6, secondary=#8B5CF6, success=#16A34A, warning=#D97706, danger=#DC2626, surface=#FFFFFF, text=#111827\n- Spacing scale: 4/8/12/16/24/32\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":["simple","awesome","design","skills","bergside","agent-skills","agentic-ai","agentic-workflow","agents","ai-agents","ai-tools","awesome-list"],"capabilities":["skill","source-bergside","skill-simple","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/simple","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,163 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:55.396Z","embedding":null,"createdAt":"2026-04-18T22:11:41.650Z","updatedAt":"2026-05-02T12:53:55.396Z","lastSeenAt":"2026-05-02T12:53:55.396Z","tsv":"'1':192 '100':73 '111827':103 '12/14/16/20/24/32':63 '16a34a':95 '2':203 '2.2':109 '200':74 '3':214 '300':75 '3b82f6':91 '4':223 '4/8/12/16/24/32':106 '400':76 '5':233 '500':77 '6':245 '600':78 '700':79 '800':80 '8b5cf6':93 '900':81 'aa':110 'accept':226,290 'access':107,164,225,286,371,392,395 'activ':317 'add':234 'adject':359 'aesthet':390 'alon':360 'altern':178 'ambigu':150,358 'anatomi':217,281 'anchor':361 'anti':236,299 'anti-pattern':235,298 'author':35,190 'avoid':141,145,149 'behavior':153,222,285,325,342 'brand':54 'case':345 'checklist':250,305 'clariti':166 'clean':8,60 'code':256 'color':11,82,336 'color-token':335 'compon':159,211,216,278,306,434 'component-level':210,277 'concis':120,184 'concret':170,419 'confid':121 'conflict':388 'consist':160,380 'constraint':208,397 'content':230,292 'content-writ':229 'context':270 'contrast':143 'creat':39 'criteria':227,291 'd97706':97 'danger':88,98 'dc2626':99 'default':171,312 'defin':204,309 'depend':356 'describ':323 'design':6,22,32,38,53,195,264,273 'design-system':31,263 'direct':48 'disabl':318 'display':67 'do-rul':412 'edg':344 'empti':348 'end':246 'engin':51 'error':320 'everi':370,411 'exampl':297,369,396,423 'execut':254 'exist':242,433 'expect':152,232,308 'expert':30 'explain':173 'explicit':137,339 'ffffff':101 'first':113,157 'flag':387 'focus':116,188,315 'focus-vis':314 'follow':154 'font':64 'foundat':56,156,207,276 'frill':5 'gate':352 'generat':262 'goal':272 'guidanc':44,182,213,266,431 'guidelin':34,189 'help':122 'hierarchi':133 'hover':313 'implement':42,187,303,377 'implementation-focus':186 'implementation-readi':41 'includ':224,340,429 'inconsist':146,243 'intent':196 'inter':66,68 'interact':114,135,221,324 'introduc':425 'intuit':13 'jetbrain':70 'keep':134,181 'keyboard':112,327 'keyboard-first':111 'label':151,347 'languag':398 'layout':14 'least':417 'level':212,279 'load':319 'local':385 'long':346 'low':142 'migrat':239,430 'minim':59 'mission':26 'mono':69,71 'must':373,400 'negoti':404 'neutral':10,85 'new':427 'no-fril':3 'non':403 'non-negoti':402 'note':240 'novelti':168 'off':176 'one':198,383,418 'one-off':382 'opinion':183 'optim':386 'output':259 'overflow':350 'pair':410 'palett':83 'pattern':237,300,428 'pointer':328 'possibl':180 'practic':40 'prefer':125,378 'preserv':131 'primari':65,84,90 'priorit':163,394 'prohibit':302 'propos':201 'provid':169 'qa':249,304 'qualiti':351 'raw':129 'readi':43 'recommend':409 'relev':322 'requir':258,287,310 'respons':284,341 'restat':193 'review':257 'rhythm':148 'rule':123,138,202,280,307,354,363,405,414 'scale':62,105 'secondari':92 'semant':126 'sentenc':199 'simpl':1,21,37 'skill':24 'skill-simple' 'source-bergside' 'space':104,147,332 'specifi':215 'standard':295 'state':117,136,218,283,311,331,349 'statement':372 'stay':16 'straightforward':2 'structur':260,269 'style':55,58 'success':86,94 'surfac':100 'system':23,33,265,379 't-exampl':421 'testabl':289,375 'text':102,144 'threshold':367 'token':89,127,205,274,337,366 'tone':119,294 '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':330 'trade':175 'trade-off':174 'typographi':9,61,333 'ui':244 'uncertain':162 'univers':25 'usag':338 'use':49,267,399 'valu':130 'variant':219,282 'visibl':115,316 'visual':57,132 'warn':87,96 'way':20 'wcag':108 'weight':72 'workflow':191 'write':118,231","prices":[{"id":"76011926-d942-4f46-8afa-be1380e54c93","listingId":"4ef55226-bed6-46c1-bfce-9e147955d5b2","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:41.650Z"}],"sources":[{"listingId":"4ef55226-bed6-46c1-bfce-9e147955d5b2","source":"github","sourceId":"bergside/awesome-design-skills/simple","sourceUrl":"https://github.com/bergside/awesome-design-skills/tree/main/skills/simple","isPrimary":false,"firstSeenAt":"2026-04-18T22:11:41.650Z","lastSeenAt":"2026-05-02T12:53:55.396Z"}],"details":{"listingId":"4ef55226-bed6-46c1-bfce-9e147955d5b2","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"bergside","slug":"simple","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":"f3a9f8ef93c4ebf206f39135d361579fcba04900","skill_md_path":"skills/simple/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/bergside/awesome-design-skills/tree/main/skills/simple"},"layout":"multi","source":"github","category":"awesome-design-skills","frontmatter":{"name":"simple","license":"MIT","description":"Straightforward, no-frills design with clean typography, neutral colors, and intuitive layouts that stay out of the way."},"skills_sh_url":"https://skills.sh/bergside/awesome-design-skills/simple"},"updatedAt":"2026-05-02T12:53:55.396Z"}}