{"id":"84d4b627-8717-4355-bd46-ce254abdc2e0","shortId":"rXf8ky","kind":"skill","title":"design-md-airtable","tagline":"Design system reference for design md airtable.","description":"# Design System: Airtable\n\n## 1. Visual Theme & Atmosphere\n\nAirtable's website is a clean, enterprise-friendly platform that communicates \"sophisticated simplicity\" through a white canvas with deep navy text (`#181d26`) and Airtable Blue (`#1b61c9`) as the primary interactive accent. The Haas font family (display + text variants) creates a Swiss-precision typography system with positive letter-spacing throughout.\n\n**Key Characteristics:**\n- White canvas with deep navy text (`#181d26`)\n- Airtable Blue (`#1b61c9`) as primary CTA and link color\n- Haas + Haas Groot Disp dual font system\n- Positive letter-spacing on body text (0.08px0.28px)\n- 12px radius buttons, 16px32px for cards\n- Multi-layer blue-tinted shadow: `rgba(45,127,249,0.28) 0px 1px 3px`\n- Semantic theme tokens: `--theme_*` CSS variable naming\n\n## 2. Color Palette & Roles\n\n### Primary\n- **Deep Navy** (`#181d26`): Primary text\n- **Airtable Blue** (`#1b61c9`): CTA buttons, links\n- **White** (`#ffffff`): Primary surface\n- **Spotlight** (`rgba(249,252,255,0.97)`): `--theme_button-text-spotlight`\n\n### Semantic\n- **Success Green** (`#006400`): `--theme_success-text`\n- **Weak Text** (`rgba(4,14,32,0.69)`): `--theme_text-weak`\n- **Secondary Active** (`rgba(7,12,20,0.82)`): `--theme_button-text-secondary-active`\n\n### Neutral\n- **Dark Gray** (`#333333`): Secondary text\n- **Mid Blue** (`#254fad`): Link/accent blue variant\n- **Border** (`#e0e2e6`): Card borders\n- **Light Surface** (`#f8fafc`): Subtle surface\n\n### Shadows\n- **Blue-tinted** (`rgba(0,0,0,0.32) 0px 0px 1px, rgba(0,0,0,0.08) 0px 0px 2px, rgba(45,127,249,0.28) 0px 1px 3px, rgba(0,0,0,0.06) 0px 0px 0px 0.5px inset`)\n- **Soft** (`rgba(15,48,106,0.05) 0px 0px 20px`)\n\n## 3. Typography Rules\n\n### Font Families\n- **Primary**: `Haas`, fallbacks: `-apple-system, system-ui, Segoe UI, Roboto`\n- **Display**: `Haas Groot Disp`, fallback: `Haas`\n\n### Hierarchy\n\n| Role | Font | Size | Weight | Line Height | Letter Spacing |\n|------|------|------|--------|-------------|----------------|\n| Display Hero | Haas | 48px | 400 | 1.15 | normal |\n| Display Bold | Haas Groot Disp | 48px | 900 | 1.50 | normal |\n| Section Heading | Haas | 40px | 400 | 1.25 | normal |\n| Sub-heading | Haas | 32px | 400500 | 1.151.25 | normal |\n| Card Title | Haas | 24px | 400 | 1.201.30 | 0.12px |\n| Feature | Haas | 20px | 400 | 1.251.50 | 0.1px |\n| Body | Haas | 18px | 400 | 1.35 | 0.18px |\n| Body Medium | Haas | 16px | 500 | 1.30 | 0.080.16px |\n| Button | Haas | 16px | 500 | 1.251.30 | 0.08px |\n| Caption | Haas | 14px | 400500 | 1.251.35 | 0.070.28px |\n\n## 4. Component Stylings\n\n### Buttons\n- **Primary Blue**: `#1b61c9`, white text, 16px 24px padding, 12px radius\n- **White**: white bg, `#181d26` text, 12px radius, 1px border white\n- **Cookie Consent**: `#1b61c9` bg, 2px radius (sharp)\n\n### Cards: `1px solid #e0e2e6`, 16px24px radius\n### Inputs: Standard Haas styling\n\n## 5. Layout\n- Spacing: 148px (8px base)\n- Radius: 2px (small), 12px (buttons), 16px (cards), 24px (sections), 32px (large), 50% (circles)\n\n## 6. Depth\n- Blue-tinted multi-layer shadow system\n- Soft ambient: `rgba(15,48,106,0.05) 0px 0px 20px`\n\n## 7. Do's and Don'ts\n### Do: Use Airtable Blue for CTAs, Haas with positive tracking, 12px radius buttons\n### Don't: Skip positive letter-spacing, use heavy shadows\n\n## 8. Responsive Behavior\nBreakpoints: 4251664px (23 breakpoints)\n\n## 9. Agent Prompt Guide\n- Text: Deep Navy (`#181d26`)\n- CTA: Airtable Blue (`#1b61c9`)\n- Background: White (`#ffffff`)\n- Border: `#e0e2e6`","tags":["design","airtable","galyarder","framework","galyarderlabs","agent-skills","agentic-framework","agents","ai-agents","automation","claude-code-plugin","codex-skills"],"capabilities":["skill","source-galyarderlabs","skill-design-md-airtable","topic-agent-skills","topic-agentic-framework","topic-agents","topic-ai-agents","topic-automation","topic-claude-code-plugin","topic-codex-skills","topic-copilot-skills","topic-cursor-skills","topic-framework","topic-gemini-skills","topic-hermes-skill"],"categories":["galyarder-framework"],"synonyms":[],"warnings":[],"endpointUrl":"https://skills.sh/galyarderlabs/galyarder-framework/design-md-airtable","protocol":"skill","transport":"skills-sh","auth":{"type":"none","details":{"cli":"npx skills add galyarderlabs/galyarder-framework","source_repo":"https://github.com/galyarderlabs/galyarder-framework","install_from":"skills.sh"}},"qualityScore":"0.455","qualityRationale":"deterministic score 0.46 from registry signals: · indexed on github topic:agent-skills · 11 github stars · SKILL.md body (3,502 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-18T19:07:45.546Z","embedding":null,"createdAt":"2026-05-10T01:06:43.389Z","updatedAt":"2026-05-18T19:07:45.546Z","lastSeenAt":"2026-05-18T19:07:45.546Z","tsv":"'0':222,223,224,230,231,232,246,247,248 '0.05':261,448 '0.06':249 '0.070.28':370 '0.08':103,233,363 '0.080.16':356 '0.1':341 '0.12':334 '0.18':348 '0.28':122,241 '0.32':225 '0.5':253 '0.69':178 '0.82':189 '0.97':158 '006400':167 '0px':123,226,227,234,235,242,250,251,252,262,263,449,450 '1':15 '1.15':302 '1.151.25':326 '1.201.30':333 '1.25':318 '1.251.30':362 '1.251.35':369 '1.251.50':340 '1.30':355 '1.35':347 '1.50':311 '106':260,447 '12':187 '127':120,239 '12px':105,384,391,422,468 '14':176 '148px':416 '14px':367 '15':258,445 '16px':353,360,381,424 '16px24px':407 '16px32px':108 '181d26':41,79,140,389,495 '18px':345 '1b61c9':45,82,145,378,398,499 '1px':124,228,243,393,404 '2':133 '20':188 '20px':264,338,451 '23':486 '249':121,155,240 '24px':331,382,426 '252':156 '254fad':204 '255':157 '2px':236,400,420 '3':265 '32':177 '32px':324,428 '333333':199 '3px':125,244 '4':175,372 '400':301,317,332,339,346 '400500':325,368 '40px':316 '4251664px':485 '45':119,238 '48':259,446 '48px':300,309 '5':413 '50':430 '500':354,361 '6':432 '7':186,452 '8':481 '8px':417 '9':488 '900':310 'accent':50 'activ':184,195 'agent':489 'airtabl':4,11,14,19,43,80,143,460,497 'ambient':443 'appl':274 'apple-system':273 'atmospher':18 'background':500 'base':418 'behavior':483 'bg':388,399 'blue':44,81,115,144,203,206,219,377,435,461,498 'blue-tint':114,218,434 'bodi':101,343,350 'bold':305 'border':208,211,394,503 'breakpoint':484,487 'button':107,147,161,192,358,375,423,470 'button-text-secondary-act':191 'button-text-spotlight':160 'canva':36,74 'caption':365 'card':110,210,328,403,425 'characterist':72 'circl':431 'clean':24 'color':88,134 'communic':30 'compon':373 'consent':397 'cooki':396 'creat':58 'css':130 'cta':85,146,496 'ctas':463 'dark':197 'deep':38,76,138,493 'depth':433 'design':2,5,9,12 'design-md-airt':1 'disp':92,285,308 'display':55,282,297,304 'dual':93 'e0e2e6':209,406,504 'enterpris':26 'enterprise-friend':25 'f8fafc':214 'fallback':272,286 'famili':54,269 'featur':336 'ffffff':150,502 'font':53,94,268,290 'friend':27 'gray':198 'green':166 'groot':91,284,307 'guid':491 'haa':52,89,90,271,283,287,299,306,315,323,330,337,344,352,359,366,411,464 'head':314,322 'heavi':479 'height':294 'hero':298 'hierarchi':288 'input':409 'inset':255 'interact':49 'key':71 'larg':429 'layer':113,439 'layout':414 'letter':68,98,295,476 'letter-spac':67,97,475 'light':212 'line':293 'link':87,148 'link/accent':205 'md':3,10 'medium':351 'mid':202 'multi':112,438 'multi-lay':111,437 'name':132 'navi':39,77,139,494 'neutral':196 'normal':303,312,319,327 'pad':383 'palett':135 'platform':28 'posit':66,96,466,474 'precis':62 'primari':48,84,137,141,151,270,376 'prompt':490 'px':254,335,342,349,357,364,371 'px0.28px':104 'radius':106,385,392,401,408,419,469 'refer':7 'respons':482 'rgba':118,154,174,185,221,229,237,245,257,444 'roboto':281 'role':136,289 'rule':267 'secondari':183,194,200 'section':313,427 'sego':279 'semant':126,164 'shadow':117,217,440,480 'sharp':402 'simplic':32 'size':291 'skill' 'skill-design-md-airtable' 'skip':473 'small':421 'soft':256,442 'solid':405 'sophist':31 'source-galyarderlabs' 'space':69,99,296,415,477 'spotlight':153,163 'standard':410 'style':374,412 'sub':321 'sub-head':320 'subtl':215 'success':165,170 'success-text':169 'surfac':152,213,216 'swiss':61 'swiss-precis':60 'system':6,13,64,95,275,277,441 'system-ui':276 'text':40,56,78,102,142,162,171,173,181,193,201,380,390,492 'text-weak':180 'theme':17,127,129,159,168,179,190 'throughout':70 'tint':116,220,436 'titl':329 'token':128 'topic-agent-skills' 'topic-agentic-framework' 'topic-agents' 'topic-ai-agents' 'topic-automation' 'topic-claude-code-plugin' 'topic-codex-skills' 'topic-copilot-skills' 'topic-cursor-skills' 'topic-framework' 'topic-gemini-skills' 'topic-hermes-skill' 'track':467 'ts':457 'typographi':63,266 'ui':278,280 'use':459,478 'variabl':131 'variant':57,207 'visual':16 'weak':172,182 'websit':21 'weight':292 'white':35,73,149,379,386,387,395,501","prices":[{"id":"3c8f92d9-935d-40ed-b15e-ba79e92fbdbc","listingId":"84d4b627-8717-4355-bd46-ce254abdc2e0","amountUsd":"0","unit":"free","nativeCurrency":null,"nativeAmount":null,"chain":null,"payTo":null,"paymentMethod":"skill-free","isPrimary":true,"details":{"org":"galyarderlabs","category":"galyarder-framework","install_from":"skills.sh"},"createdAt":"2026-05-10T01:06:43.389Z"}],"sources":[{"listingId":"84d4b627-8717-4355-bd46-ce254abdc2e0","source":"github","sourceId":"galyarderlabs/galyarder-framework/design-md-airtable","sourceUrl":"https://github.com/galyarderlabs/galyarder-framework/tree/main/skills/design-md-airtable","isPrimary":false,"firstSeenAt":"2026-05-10T01:06:43.389Z","lastSeenAt":"2026-05-18T19:07:45.546Z"}],"details":{"listingId":"84d4b627-8717-4355-bd46-ce254abdc2e0","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"galyarderlabs","slug":"design-md-airtable","github":{"repo":"galyarderlabs/galyarder-framework","stars":11,"topics":["agent-skills","agentic-framework","agents","ai-agents","automation","claude-code-plugin","codex-skills","copilot-skills","cursor-skills","framework","gemini-skills","hermes-skill","marketing","openclaw-skills","opencode-skills","seo","tdd"],"license":"mit","html_url":"https://github.com/galyarderlabs/galyarder-framework","pushed_at":"2026-05-17T20:44:45Z","description":"An agentic skills framework orchestration for the 1-Man Army. Implementing Autonomous Goal Integration (AGI) to transform vision into deterministic execution.","skill_md_sha":"c29f7cf5040baf3ad89be0eaa774bf86e79b9af4","skill_md_path":"skills/design-md-airtable/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/galyarderlabs/galyarder-framework/tree/main/skills/design-md-airtable"},"layout":"multi","source":"github","category":"galyarder-framework","frontmatter":{"name":"design-md-airtable","description":"Design system reference for design md airtable."},"skills_sh_url":"https://skills.sh/galyarderlabs/galyarder-framework/design-md-airtable"},"updatedAt":"2026-05-18T19:07:45.546Z"}}