{"id":"23cfcb6f-6a8d-41c7-bcd4-9bf5b49c8973","shortId":"tETun8","kind":"skill","title":"sleek","tagline":"Modern minimalist aesthetic with clean lines, intentional color palette, subtle interactions, and consistent spacing.","description":"<!-- TYPEUI_SH_MANAGED_START -->\n# Sleek Design System Skill (Universal)\n\n## Mission\nYou are an expert design-system guideline author for Sleek.\nCreate practical, implementation-ready guidance that can be directly used by engineers and designers.\n\n## Brand\nSleek UI/UX design emphasizes a modern, minimalist aesthetic (\"less is more\") focused on clean lines, high functionality, and reduced cognitive load. Key elements include a limited, intentional color palette (e.g., the 60-30-10 rule), subtle, non-distracting interactions, and consistent spacing.\n\n## Style Foundations\n- Visual style: modern, minimal, clean\n- Typography scale: desktop-first expressive scale | 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: 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":["sleek","awesome","design","skills","bergside","agent-skills","agentic-ai","agentic-workflow","agents","ai-agents","ai-tools","awesome-list"],"capabilities":["skill","source-bergside","skill-sleek","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/sleek","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,473 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.549Z","embedding":null,"createdAt":"2026-04-18T22:11:43.131Z","updatedAt":"2026-05-02T12:53:55.549Z","lastSeenAt":"2026-05-02T12:53:55.549Z","tsv":"'-10':82 '-30':81 '1':236 '100':115 '111827':145 '16a34a':137 '2':247 '2.2':153 '200':116 '3':258 '300':117 '3b82f6':133 '4':267 '400':118 '5':277 '500':119 '6':289 '60':80 '600':120 '700':121 '800':122 '8b5cf6':135 '8pt':148 '900':123 'aa':154 'accept':270,334 'access':151,208,269,330,415,436,439 'activ':361 'add':278 'adject':403 'aesthet':4,56,434 'alon':404 'altern':222 'ambigu':194,402 'anatomi':261,325 'anchor':405 'anti':280,343 'anti-pattern':279,342 'author':30,234 'avoid':185,189,193 'baselin':149 'behavior':197,266,329,369,386 'brand':48 'case':389 'checklist':294,349 'clariti':210 'clean':6,62,98 'code':300 'cognit':68 'color':9,76,124,380 'color-token':379 'compon':203,255,260,322,350,478 'component-level':254,321 'concis':164,228 'concret':214,463 'confid':165 'conflict':432 'consist':14,90,204,424 'constraint':252,441 'content':274,336 'content-writ':273 'context':314 'contrast':187 'creat':33 'criteria':271,335 'd97706':139 'danger':130,140 'dc2626':141 'default':215,356 'defin':248,353 'depend':400 'describ':367 'design':17,27,47,51,239,308,317 'design-system':26,307 'desktop':102 'desktop-first':101 'direct':42 'disabl':362 'display':109 'distract':87 'do-rul':456 'e.g':78 'edg':388 'element':71 'emphas':52 'empti':392 'end':290 'engin':45 'error':364 'everi':414,455 'exampl':341,413,440,467 'execut':298 'exist':286,477 'expect':196,276,352 'expert':25 'explain':217 'explicit':181,383 'express':104 'ffffff':143 'first':103,157,201 'flag':431 'focus':60,160,232,359 'focus-vis':358 'follow':198 'font':106 'foundat':93,200,251,320 'function':65 'gate':396 'generat':306 'goal':316 'grid':150 'guidanc':38,226,257,310,475 'guidelin':29,233 'help':166 'hierarchi':177 'high':64 'hover':357 'implement':36,231,347,421 'implementation-focus':230 'implementation-readi':35 'includ':72,268,384,473 'inconsist':190,287 'intent':8,75,240 'inter':108,110 'interact':12,88,158,179,265,368 'introduc':469 'jetbrain':112 'keep':178,225 'key':70 'keyboard':156,371 'keyboard-first':155 'label':195,391 'languag':442 'least':461 'less':57 'level':256,323 'limit':74 'line':7,63 'load':69,363 'local':429 'long':390 'low':186 'migrat':283,474 'minim':97 'minimalist':3,55 'mission':21 'modern':2,54,96 'mono':111,113 'must':417,444 'negoti':448 'neutral':127 'new':471 'non':86,447 'non-distract':85 'non-negoti':446 'note':284 'novelti':212 'off':220 'one':242,427,462 'one-off':426 'opinion':227 'optim':430 'output':303 'overflow':394 'pair':454 'palett':10,77,125 'pattern':281,344,472 'pointer':372 'possibl':224 'practic':34 'prefer':169,422 'preserv':175 'primari':107,126,132 'priorit':207,438 'prohibit':346 'propos':245 'provid':213 'qa':293,348 'qualiti':395 'raw':173 'readi':37 'recommend':453 'reduc':67 'relev':366 'requir':302,331,354 'respons':328,385 'restat':237 'review':301 'rhythm':192 'rule':83,167,182,246,324,351,398,407,449,458 'scale':100,105,147 'secondari':134 'semant':170 'sentenc':243 'skill':19 'skill-sleek' 'sleek':1,16,32,49 'source-bergside' 'space':15,91,146,191,376 'specifi':259 'standard':339 'state':161,180,262,327,355,375,393 'statement':416 'structur':304,313 'style':92,95 'subtl':11,84 'success':128,136 'surfac':142 'system':18,28,309,423 't-exampl':465 'testabl':333,419 'text':144,188 'threshold':411 'token':131,171,249,318,381,410 'tone':163,338 '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':374 'trade':219 'trade-off':218 'typographi':99,377 'ui':288 'ui/ux':50 'uncertain':206 'univers':20 'usag':382 'use':43,311,443 'valu':174 'variant':263,326 'visibl':159,360 'visual':94,176 'warn':129,138 'wcag':152 'weight':114 'workflow':235 'write':162,275","prices":[{"id":"87137d92-855f-480a-9b0e-10a3d765030b","listingId":"23cfcb6f-6a8d-41c7-bcd4-9bf5b49c8973","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:43.131Z"}],"sources":[{"listingId":"23cfcb6f-6a8d-41c7-bcd4-9bf5b49c8973","source":"github","sourceId":"bergside/awesome-design-skills/sleek","sourceUrl":"https://github.com/bergside/awesome-design-skills/tree/main/skills/sleek","isPrimary":false,"firstSeenAt":"2026-04-18T22:11:43.131Z","lastSeenAt":"2026-05-02T12:53:55.549Z"}],"details":{"listingId":"23cfcb6f-6a8d-41c7-bcd4-9bf5b49c8973","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"bergside","slug":"sleek","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":"e74d8d0b1065c6804fe7b163e58131852c4c69f0","skill_md_path":"skills/sleek/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/bergside/awesome-design-skills/tree/main/skills/sleek"},"layout":"multi","source":"github","category":"awesome-design-skills","frontmatter":{"name":"sleek","license":"MIT","description":"Modern minimalist aesthetic with clean lines, intentional color palette, subtle interactions, and consistent spacing."},"skills_sh_url":"https://skills.sh/bergside/awesome-design-skills/sleek"},"updatedAt":"2026-05-02T12:53:55.549Z"}}