{"id":"651af332-ed43-4e08-900a-5d27a96e7a66","shortId":"Tg4eX3","kind":"skill","title":"design-md-nvidia","tagline":"Design system reference for design md nvidia.","description":"# Design System: NVIDIA\n\n## 1. Visual Theme & Atmosphere\n\nNVIDIA's website is a high-contrast, technology-forward experience that communicates raw computational power through design restraint. The page is built on a stark black (`#000000`) and white (`#ffffff`) foundation, punctuated by NVIDIA's signature green (`#76b900`) -- a color so specific it functions as a brand fingerprint. This is not the lush green of nature; it's the electric, lime-shifted green of GPU-rendered light, a color that sits between chartreuse and kelly green and immediately signals \"NVIDIA\" to anyone in technology.\n\nThe custom NVIDIA-EMEA font family (with Arial and Helvetica fallbacks) creates a clean, industrial typographic voice. Headings at 36px bold with tight 1.25 line-height create dense, authoritative blocks of text. The font lacks the geometric playfulness of Silicon Valley sans-serifs -- it's European, pragmatic, and engineering-focused. Body text runs at 15-16px, comfortable for reading but not generous, maintaining the sense that screen real estate is optimized like GPU memory.\n\nWhat distinguishes NVIDIA's design from other dark-background tech sites is the disciplined use of the green accent. The `#76b900` appears in borders (`2px solid #76b900`), link underlines (`underline 2px rgb(118, 185, 0)`), and CTAs -- but never as backgrounds or large surface areas on the main content. The green is a signal, not a surface. Combined with a deep shadow system (`rgba(0, 0, 0, 0.3) 0px 0px 5px`) and minimal border radius (1-2px), the overall effect is of precision engineering hardware rendered in pixels.\n\n**Key Characteristics:**\n- NVIDIA Green (`#76b900`) as pure accent -- borders, underlines, and interactive highlights only\n- Black (`#000000`) dominant background with white (`#ffffff`) text on dark sections\n- NVIDIA-EMEA custom font with Arial/Helvetica fallback -- industrial, European, clean\n- Tight line-heights (1.25 for headings) creating dense, authoritative text blocks\n- Minimal border radius (1-2px) -- sharp, engineered corners throughout\n- Green-bordered buttons (`2px solid #76b900`) as primary interactive pattern\n- Font Awesome 6 Pro/Sharp icon system at weight 900 for sharp iconography\n- Multi-framework architecture (PrimeReact, Fluent UI, Element Plus) enabling rich interactive components\n\n## 2. Color Palette & Roles\n\n### Primary Brand\n- **NVIDIA Green** (`#76b900`): The signature -- borders, link underlines, CTA outlines, active indicators. Never used as large surface fills.\n- **True Black** (`#000000`): Primary page background, text on light surfaces, dominant tone.\n- **Pure White** (`#ffffff`): Text on dark backgrounds, light section backgrounds, card surfaces.\n\n### Extended Brand Palette\n- **NVIDIA Green Light** (`#bff230`): Bright lime accent for highlights and hover states.\n- **Orange 400** (`#df6500`): Warm accent for alerts, featured badges, or energy-related contexts.\n- **Yellow 300** (`#ef9100`): Secondary warm accent, product category highlights.\n- **Yellow 050** (`#feeeb2`): Light warm surface for callout backgrounds.\n\n### Status & Semantic\n- **Red 500** (`#e52020`): Error states, destructive actions, critical alerts.\n- **Red 800** (`#650b0b`): Deep red for severe warning backgrounds.\n- **Green 500** (`#3f8500`): Success states, positive indicators (darker than brand green).\n- **Blue 700** (`#0046a4`): Informational accents, link hover alternative.\n\n### Decorative\n- **Purple 800** (`#4d1368`): Deep purple for gradient ends, premium/AI contexts.\n- **Purple 100** (`#f9d4ff`): Light purple surface tint.\n- **Fuchsia 700** (`#8c1c55`): Rich accent for special promotions or featured content.\n\n### Neutral Scale\n- **Gray 300** (`#a7a7a7`): Muted text, disabled labels.\n- **Gray 400** (`#898989`): Secondary text, metadata.\n- **Gray 500** (`#757575`): Tertiary text, placeholders, footers.\n- **Gray Border** (`#5e5e5e`): Subtle borders, divider lines.\n- **Near Black** (`#1a1a1a`): Dark surfaces, card backgrounds on black pages.\n\n### Interactive States\n- **Link Default (dark bg)** (`#ffffff`): White links on dark backgrounds.\n- **Link Default (light bg)** (`#000000`): Black links with green underline on light backgrounds.\n- **Link Hover** (`#3860be`): Blue shift on hover across all link variants.\n- **Button Hover** (`#1eaedb`): Teal highlight for button hover states.\n- **Button Active** (`#007fff`): Bright blue for active/pressed button states.\n- **Focus Ring** (`#000000 solid 2px`): Black outline for keyboard focus.\n\n### Shadows & Depth\n- **Card Shadow** (`rgba(0, 0, 0, 0.3) 0px 0px 5px 0px`): Subtle ambient shadow for elevated cards.\n\n## 3. Typography Rules\n\n### Font Family\n- **Primary**: `NVIDIA-EMEA`, with fallbacks: `Arial, Helvetica, sans-serif`\n- **Icon Font**: `Font Awesome 6 Pro` (weight 900 for solid icons, 700 for regular)\n- **Icon Sharp**: `Font Awesome 6 Sharp` (weight 300 for light icons, 400 for regular)\n\n### Hierarchy\n\n| Role | Font | Size | Weight | Line Height | Letter Spacing | Notes |\n|------|------|------|--------|-------------|----------------|-------|\n| Display Hero | NVIDIA-EMEA | 36px (2.25rem) | 700 | 1.25 (tight) | normal | Maximum impact headlines |\n| Section Heading | NVIDIA-EMEA | 24px (1.50rem) | 700 | 1.25 (tight) | normal | Section titles, card headings |\n| Sub-heading | NVIDIA-EMEA | 22px (1.38rem) | 400 | 1.75 (relaxed) | normal | Feature descriptions, subtitles |\n| Card Title | NVIDIA-EMEA | 20px (1.25rem) | 700 | 1.25 (tight) | normal | Card and module headings |\n| Body Large | NVIDIA-EMEA | 18px (1.13rem) | 700 | 1.67 (relaxed) | normal | Emphasized body, lead paragraphs |\n| Body | NVIDIA-EMEA | 16px (1.00rem) | 400 | 1.50 | normal | Standard reading text |\n| Body Bold | NVIDIA-EMEA | 16px (1.00rem) | 700 | 1.50 | normal | Strong labels, nav items |\n| Body Small | NVIDIA-EMEA | 15px (0.94rem) | 400 | 1.67 (relaxed) | normal | Secondary content, descriptions |\n| Body Small Bold | NVIDIA-EMEA | 15px (0.94rem) | 700 | 1.50 | normal | Emphasized secondary content |\n| Button Large | NVIDIA-EMEA | 18px (1.13rem) | 700 | 1.25 (tight) | normal | Primary CTA buttons |\n| Button | NVIDIA-EMEA | 16px (1.00rem) | 700 | 1.25 (tight) | normal | Standard buttons |\n| Button Compact | NVIDIA-EMEA | 14.4px (0.90rem) | 700 | 1.00 (tight) | 0.144px | Small/compact buttons |\n| Link | NVIDIA-EMEA | 14px (0.88rem) | 700 | 1.43 | normal | Navigation links |\n| Link Uppercase | NVIDIA-EMEA | 14px (0.88rem) | 700 | 1.43 | normal | `text-transform: uppercase`, nav labels |\n| Caption | NVIDIA-EMEA | 14px (0.88rem) | 600 | 1.50 | normal | Metadata, timestamps |\n| Caption Small | NVIDIA-EMEA | 12px (0.75rem) | 400 | 1.25 (tight) | normal | Fine print, legal |\n| Micro Label | NVIDIA-EMEA | 10px (0.63rem) | 700 | 1.50 | normal | `text-transform: uppercase`, tiny badges |\n| Micro | NVIDIA-EMEA | 11px (0.69rem) | 700 | 1.00 (tight) | normal | Smallest UI text |\n\n### Principles\n- **Bold as the default voice**: NVIDIA leans heavily on weight 700 for headings, buttons, links, and labels. The 400 weight is reserved for body text and descriptions -- everything else is bold, projecting confidence and authority.\n- **Tight headings, relaxed body**: Heading line-height is consistently 1.25 (tight), while body text relaxes to 1.50-1.67. This contrast creates visual density at the top of content blocks and comfortable readability in paragraphs.\n- **Uppercase for navigation**: Link labels use `text-transform: uppercase` with weight 700, creating a navigation voice that reads like hardware specification labels.\n- **No decorative tracking**: Letter-spacing is normal throughout, except for compact buttons (0.144px). The font itself carries the industrial character without manipulation.\n\n## 4. Component Stylings\n\n### Buttons\n\n**Primary (Green Border)**\n- Background: `transparent`\n- Text: `#000000`\n- Padding: 11px 13px\n- Border: `2px solid #76b900`\n- Radius: 2px\n- Font: 16px weight 700\n- Hover: background `#1eaedb`, text `#ffffff`\n- Active: background `#007fff`, text `#ffffff`, border `1px solid #003eff`, scale(1)\n- Focus: background `#1eaedb`, text `#ffffff`, outline `#000000 solid 2px`, opacity 0.9\n- Use: Primary CTA (\"Learn More\", \"Explore Solutions\")\n\n**Secondary (Green Border Thin)**\n- Background: transparent\n- Border: `1px solid #76b900`\n- Radius: 2px\n- Use: Secondary actions, alternative CTAs\n\n**Compact / Inline**\n- Font: 14.4px weight 700\n- Letter-spacing: 0.144px\n- Line-height: 1.00\n- Use: Inline CTAs, compact navigation\n\n### Cards & Containers\n- Background: `#ffffff` (light) or `#1a1a1a` (dark sections)\n- Border: none (clean edges) or `1px solid #5e5e5e`\n- Radius: 2px\n- Shadow: `rgba(0, 0, 0, 0.3) 0px 0px 5px 0px` for elevated cards\n- Hover: shadow intensification\n- Padding: 16-24px internal\n\n### Links\n- **On Dark Background**: `#ffffff`, no underline, hover shifts to `#3860be`\n- **On Light Background**: `#000000` or `#1a1a1a`, underline `2px solid #76b900`, hover shifts to `#3860be`, underline removed\n- **Green Links**: `#76b900`, hover shifts to `#3860be`\n- **Muted Links**: `#666666`, hover shifts to `#3860be`\n\n### Navigation\n- Dark black background (`#000000`)\n- Logo left-aligned, prominent NVIDIA wordmark\n- Links: NVIDIA-EMEA 14px weight 700 uppercase, `#ffffff`\n- Hover: color shift, no underline change\n- Mega-menu dropdowns for product categories\n- Sticky on scroll with backdrop\n\n### Image Treatment\n- Product/GPU renders as hero images, often full-width\n- Screenshot images with subtle shadow for depth\n- Green gradient overlays on dark hero sections\n- Circular avatar containers with 50% radius\n\n### Distinctive Components\n\n**Product Cards**\n- Clean white or dark card with minimal radius (2px)\n- Green accent border or underline on title\n- Bold heading + lighter description pattern\n- CTA with green border at bottom\n\n**Tech Spec Tables**\n- Industrial grid layouts\n- Alternating row backgrounds (subtle gray shift)\n- Bold labels, regular values\n- Green highlights for key metrics\n\n**Cookie/Consent Banner**\n- Fixed bottom positioning\n- Rounded buttons (2px radius)\n- Gray border treatments\n\n## 5. Layout Principles\n\n### Spacing System\n- Base unit: 8px\n- Scale: 1px, 2px, 3px, 4px, 5px, 6px, 7px, 8px, 9px, 10px, 11px, 12px, 13px, 15px\n- Primary padding values: 8px, 11px, 13px, 16px, 24px, 32px\n- Section spacing: 48-80px vertical padding\n\n### Grid & Container\n- Max content width: approximately 1200px (contained)\n- Full-width hero sections with contained text\n- Feature sections: 2-3 column grids for product cards\n- Single-column for article/blog content\n- Sidebar layouts for documentation\n\n### Whitespace Philosophy\n- **Purposeful density**: NVIDIA uses tighter spacing than typical SaaS sites, reflecting the density of technical content. White space exists to separate concepts, not to create luxury emptiness.\n- **Section rhythm**: Dark sections alternate with white sections, using background color (not just spacing) to separate content blocks.\n- **Card density**: Product cards sit close together with 16-20px gaps, creating a catalog feel rather than a gallery feel.\n\n### Border Radius Scale\n- Micro (1px): Inline spans, tiny elements\n- Standard (2px): Buttons, cards, containers, inputs -- the default for nearly everything\n- Circle (50%): Avatar images, circular tab indicators\n\n## 6. Depth & Elevation\n\n| Level | Treatment | Use |\n|-------|-----------|-----|\n| Flat (Level 0) | No shadow | Page backgrounds, inline text |\n| Subtle (Level 1) | `rgba(0,0,0,0.3) 0px 0px 5px 0px` | Standard cards, modals |\n| Border (Level 1b) | `1px solid #5e5e5e` | Content dividers, section borders |\n| Green accent (Level 2) | `2px solid #76b900` | Active elements, CTAs, selected items |\n| Focus (Accessibility) | `2px solid #000000` outline | Keyboard focus ring |\n\n**Shadow Philosophy**: NVIDIA's depth system is minimal and utilitarian. There is essentially one shadow value -- a 5px ambient blur at 30% opacity -- used sparingly for cards and modals. The primary depth signal is not shadow but _color contrast_: black backgrounds next to white sections, green borders on black surfaces. This creates hardware-like visual layering where depth comes from material difference, not simulated light.\n\n### Decorative Depth\n- Green gradient washes behind hero content\n- Dark-to-darker gradients (black to near-black) for section transitions\n- No glassmorphism or blur effects -- clarity over atmosphere\n\n## 7. Responsive Behavior\n\n### Breakpoints\n| Name | Width | Key Changes |\n|------|-------|-------------|\n| Mobile Small | <375px | Compact single column, reduced padding |\n| Mobile | 375-425px | Standard mobile layout |\n| Mobile Large | 425-600px | Wider mobile, some 2-col hints |\n| Tablet Small | 600-768px | 2-column grids begin |\n| Tablet | 768-1024px | Full card grids, expanded nav |\n| Desktop | 1024-1350px | Standard desktop layout |\n| Large Desktop | >1350px | Maximum content width, generous margins |\n\n### Touch Targets\n- Buttons use 11px 13px padding for comfortable tap targets\n- Navigation links at 14px uppercase with adequate spacing\n- Green-bordered buttons provide high-contrast touch targets on dark backgrounds\n- Mobile: hamburger menu collapse with full-screen overlay\n\n### Collapsing Strategy\n- Hero: 36px heading scales down proportionally\n- Navigation: full horizontal nav collapses to hamburger menu at ~1024px\n- Product cards: 3-column to 2-column to single column stacked\n- Footer: multi-column grid collapses to single stacked column\n- Section spacing: 64-80px reduces to 32-48px on mobile\n- Images: maintain aspect ratio, scale to container width\n\n### Image Behavior\n- GPU/product renders maintain high resolution at all sizes\n- Hero images scale proportionally with viewport\n- Card images use consistent aspect ratios\n- Full-bleed dark sections maintain edge-to-edge treatment\n\n## 8. Responsive Behavior (Extended)\n\n### Typography Scaling\n- Display 36px scales to ~24px on mobile\n- Section headings 24px scale to ~20px on mobile\n- Body text maintains 15-16px across all breakpoints\n- Button text maintains 16px for consistent tap targets\n\n### Dark/Light Section Strategy\n- Dark sections (black bg, white text) alternate with light sections (white bg, black text)\n- The green accent remains consistent across both surface types\n- On dark: links are white, underlines are green\n- On light: links are black, underlines are green\n- This alternation creates natural scroll rhythm and content grouping\n\n## 9. Agent Prompt Guide\n\n### Quick Color Reference\n- Primary accent: NVIDIA Green (`#76b900`)\n- Background dark: True Black (`#000000`)\n- Background light: Pure White (`#ffffff`)\n- Heading text (dark bg): White (`#ffffff`)\n- Heading text (light bg): Black (`#000000`)\n- Body text (light bg): Black (`#000000`) or Near Black (`#1a1a1a`)\n- Body text (dark bg): White (`#ffffff`) or Gray 300 (`#a7a7a7`)\n- Link hover: Blue (`#3860be`)\n- Border accent: `2px solid #76b900`\n- Button hover: Teal (`#1eaedb`)\n\n### Example Component Prompts\n- \"Create a hero section on black background. Headline at 36px NVIDIA-EMEA weight 700, line-height 1.25, color #ffffff. Subtitle at 18px weight 400, line-height 1.67, color #a7a7a7. CTA button with transparent background, 2px solid #76b900 border, 2px radius, 11px 13px padding, text #ffffff. Hover: background #1eaedb, text white.\"\n- \"Design a product card: white background, 2px border-radius, box-shadow rgba(0,0,0,0.3) 0px 0px 5px. Title at 20px NVIDIA-EMEA weight 700, line-height 1.25, color #000000. Body at 15px weight 400, line-height 1.67, color #757575. Green underline accent on title: border-bottom 2px solid #76b900.\"\n- \"Build a navigation bar: #000000 background, sticky top. NVIDIA logo left-aligned. Links at 14px NVIDIA-EMEA weight 700 uppercase, color #ffffff. Hover: color #3860be. Green-bordered CTA button right-aligned.\"\n- \"Create a dark feature section: #000000 background. Section label at 14px weight 700 uppercase, color #76b900. Heading at 24px weight 700, color #ffffff. Description at 16px weight 400, color #a7a7a7. Three product cards in a row with 20px gap.\"\n- \"Design a footer: #000000 background. Multi-column layout with link groups. Links at 14px weight 400, color #a7a7a7. Hover: color #76b900. Bottom bar with legal text at 12px, color #757575.\"\n\n### Iteration Guide\n1. Always use `#76b900` as accent, never as a background fill -- it's a signal color for borders, underlines, and highlights\n2. Buttons are transparent with green borders by default -- filled backgrounds appear only on hover/active states\n3. Weight 700 is the dominant voice for all interactive and heading elements; 400 is only for body paragraphs\n4. Border radius is 2px for everything -- this sharp, minimal rounding is core to the industrial aesthetic\n5. Dark sections use white text; light sections use black text -- green accent works identically on both\n6. Link hover is always `#3860be` (blue) regardless of the link's default color\n7. Line-height 1.25 for headings, 1.50-1.67 for body text -- maintain this contrast for visual hierarchy\n8. Navigation uses uppercase 14px bold -- this hardware-label typography is part of the brand voice","tags":["design","nvidia","galyarder","framework","galyarderlabs","agent-skills","agentic-framework","agents","ai-agents","automation","claude-code-plugin","codex-skills"],"capabilities":["skill","source-galyarderlabs","skill-design-md-nvidia","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-nvidia","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 (17,078 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:48.134Z","embedding":null,"createdAt":"2026-05-10T01:06:46.734Z","updatedAt":"2026-05-18T19:07:48.134Z","lastSeenAt":"2026-05-18T19:07:48.134Z","tsv":"'-1.67':1032,2422 '-1024':1779 '-1350':1788 '-16':166,1959 '-2':263,328 '-20':1538 '-24':1230 '-3':1466 '-425':1752 '-48':1889 '-600':1760 '-768':1771 '-80':1443,1884 '0':221,251,252,253,642,643,644,1214,1215,1216,1585,1596,1597,1598,2160,2161,2162 '0.144':887,1085,1181 '0.3':254,645,1217,1599,2163 '0.63':953 '0.69':969 '0.75':938 '0.88':896,909,925 '0.9':1146 '0.90':882 '0.94':823,839 '000000':47,291,396,589,629,1106,1142,1247,1278,1634,2039,2056,2062,2180,2207,2243,2280 '003eff':1133 '0046a4':498 '007fff':620,1127 '050':457 '0px':255,256,646,647,649,1218,1219,1221,1600,1601,1603,2164,2165 '1':15,262,327,1135,1594,2310 '1.00':794,808,867,885,972,1186 '1.13':779,853 '1.25':131,316,719,734,763,766,856,870,941,1024,2111,2178,2418 '1.38':748 '1.43':899,912 '1.50':731,797,811,842,928,956,1031,2421 '1.67':782,826,2122,2189 '1.75':751 '100':516 '1024':1787 '1024px':1859 '10px':952,1426 '118':219 '11px':968,1108,1427,1435,1805,2136 '1200px':1453 '12px':937,1428,2305 '1350px':1795 '13px':1109,1429,1436,1806,2137 '14.4':880,1174 '14px':895,908,924,1290,1815,2218,2248,2291,2436 '15':165,1958 '15px':822,838,1430,2183 '16':1229,1537 '16px':793,807,866,1117,1437,1967,2263 '185':220 '18px':778,852,2116 '1a1a1a':565,1198,1249,2066 '1b':1609 '1eaedb':611,1122,1138,2089,2143 '1px':1131,1161,1206,1417,1554,1610 '2':370,1465,1621,1765,1773,1865,2331 '2.25':716 '20px':762,1952,2169,2275 '22px':747 '24px':730,1438,1944,1949,2256 '2px':211,217,338,631,1111,1115,1144,1165,1211,1251,1356,1403,1418,1560,1622,1632,2083,2130,2134,2152,2200,2370 '3':656,1862,2347 '30':1660 '300':448,536,693,2075 '32':1888 '32px':1439 '36px':127,715,1845,1941,2102 '375':1751 '375px':1744 '3860be':600,1243,1257,1266,1273,2080,2229,2405 '3f8500':487 '3px':1419 '4':1096,2366 '400':434,543,697,750,796,825,940,997,2118,2185,2265,2293,2360 '425':1759 '48':1442 '4d1368':507 '4px':1420 '5':1408,2383 '50':1342,1571 '500':468,486,549 '5e5':557,1208,1612 '5px':257,648,1220,1421,1602,1656,2166 '6':347,676,690,1577,2400 '600':927,1770 '64':1883 '650b0b':478 '666666':1269 '6px':1422 '7':1734,2414 '700':497,523,683,718,733,765,781,810,841,855,869,884,898,911,955,971,989,1061,1119,1177,1292,2107,2174,2223,2250,2258,2349 '757575':550,2191,2307 '768':1778 '76b900':58,207,213,280,340,378,1113,1163,1253,1262,1624,2034,2085,2132,2202,2253,2298,2313 '7px':1423 '8':1934,2432 '800':477,506 '898989':544 '8c1c55':524 '8px':1415,1424,1434 '9':2023 '900':353,679 '9px':1425 'a7a7a7':537,2076,2124,2267,2295 'accent':205,283,427,437,452,500,526,1358,1619,1991,2031,2082,2194,2315,2395 'access':1631 'across':605,1961,1994 'action':473,1168 'activ':386,619,1125,1625 'active/pressed':624 'adequ':1818 'aesthet':2382 'agent':2024 'alert':439,475 'align':1282,2215,2237 'altern':503,1169,1381,1515,1981,2015 'alway':2311,2404 'ambient':651,1657 'anyon':104 'appear':208,2342 'approxim':1452 'architectur':360 'area':231 'arial':115,667 'arial/helvetica':307 'article/blog':1476 'aspect':1895,1921 'atmospher':18,1733 'author':1013 'authorit':137,321 'avatar':1339,1572 'awesom':346,675,689 'backdrop':1312 'background':195,227,293,399,412,415,464,484,569,584,597,1103,1121,1126,1137,1158,1194,1236,1246,1277,1383,1520,1589,1679,1832,2035,2040,2099,2129,2142,2151,2208,2244,2281,2319,2341 'badg':441,963 'banner':1397 'bar':2206,2300 'base':1413 'begin':1776 'behavior':1736,1902,1936 'behind':1710 'bff230':424 'bg':578,588,1978,1986,2048,2054,2060,2070 'black':46,290,395,564,571,590,632,1276,1678,1687,1718,1722,1977,1987,2010,2038,2055,2061,2065,2098,2392 'bleed':1925 'block':138,323,1043,1528 'blue':496,601,622,2079,2406 'blur':1658,1729 'bodi':161,773,786,789,802,817,832,1002,1017,1027,1955,2057,2067,2181,2364,2424 'bold':128,803,834,979,1009,1364,1387,2437 'border':210,260,284,325,336,381,556,560,1102,1110,1130,1156,1160,1201,1359,1372,1406,1550,1607,1617,1685,1822,2081,2133,2154,2198,2232,2327,2337,2367 'border-bottom':2197 'border-radius':2153 'bottom':1374,1399,2199,2299 'box':2157 'box-shadow':2156 'brand':67,375,419,494,2447 'breakpoint':1737,1963 'bright':425,621 'build':2203 'built':42 'button':337,609,615,618,625,847,861,862,874,875,890,992,1084,1099,1402,1561,1803,1823,1964,2086,2126,2234,2332 'callout':463 'caption':920,932 'card':416,568,639,655,739,757,769,1192,1224,1347,1352,1471,1529,1532,1562,1605,1665,1782,1861,1917,2149,2270 'carri':1090 'catalog':1543 'categori':454,1307 'chang':1300,1741 'charact':1093 'characterist':277 'chartreus':95 'circl':1570 'circular':1338,1574 'clariti':1731 'clean':121,311,1203,1348 'close':1534 'col':1766 'collaps':1836,1842,1854,1876 'color':60,91,371,1296,1521,1676,2028,2112,2123,2179,2190,2225,2228,2252,2259,2266,2294,2297,2306,2325,2413 'column':1467,1474,1747,1774,1863,1866,1869,1874,1880,2284 'combin':244 'come':1698 'comfort':168,1045,1809 'communic':32 'compact':876,1083,1171,1190,1745 'compon':369,1097,1345,2091 'comput':34 'concept':1505 'confid':1011 'consist':1023,1920,1969,1993 'contain':1193,1340,1448,1454,1461,1563,1899 'content':235,532,830,846,1042,1450,1477,1499,1527,1614,1712,1797,2021 'context':446,514 'contrast':26,1034,1677,1827,2428 'cookie/consent':1396 'core':2378 'corner':332 'creat':119,135,319,1035,1062,1508,1541,1690,2016,2093,2238 'critic':474 'cta':384,860,1149,1369,2125,2233 'ctas':223,1170,1189,1627 'custom':108,304 'dark':194,299,411,566,577,583,1199,1235,1275,1335,1351,1513,1714,1831,1926,1975,1999,2036,2047,2069,2240,2384 'dark-background':193 'dark-to-dark':1713 'dark/light':1972 'darker':492,1716 'decor':504,1073,1705 'deep':247,479,508 'default':576,586,982,1566,2339,2412 'dens':136,320 'densiti':1037,1485,1496,1530 'depth':638,1330,1578,1643,1670,1697,1706 'descript':755,831,1005,1367,2261 'design':2,5,9,12,37,190,2146,2277 'design-md-nvidia':1 'desktop':1786,1791,1794 'destruct':472 'df6500':435 'differ':1701 'disabl':540 'disciplin':200 'display':710,1940 'distinct':1344 'distinguish':187 'divid':561,1615 'document':1481 'domin':292,404,2352 'dropdown':1304 'e52020':469 'e5e':558,1209,1613 'edg':1204,1930,1932 'edge-to-edg':1929 'ef9100':449 'effect':267,1730 'electr':80 'element':364,1558,1626,2359 'elev':654,1223,1579 'els':1007 'emea':111,303,664,714,729,746,761,777,792,806,821,837,851,865,879,894,907,923,936,951,967,1289,2105,2172,2221 'emphas':785,844 'empti':1510 'enabl':366 'end':512 'energi':444 'energy-rel':443 'engin':159,271,331 'engineering-focus':158 'error':470 'essenti':1651 'estat':180 'european':155,310 'everyth':1006,1569,2372 'exampl':2090 'except':1081 'exist':1502 'expand':1784 'experi':30 'explor':1152 'extend':418,1937 'f9d4ff':517 'fallback':118,308,666 'famili':113,660 'featur':440,531,754,1463,2241 'feeeb2':458 'feel':1544,1549 'ffffff':50,296,408,579,1124,1129,1140,1195,1237,1294,2044,2050,2072,2113,2140,2226,2260 'fill':393,2320,2340 'fine':944 'fingerprint':68 'fix':1398 'flat':1583 'fluent':362 'focus':160,627,636,1136,1630,1637 'font':112,142,305,345,659,673,674,688,702,1088,1116,1173 'footer':554,1871,2279 'forward':29 'foundat':51 'framework':359 'fuchsia':522 'full':1322,1456,1781,1839,1851,1924 'full-ble':1923 'full-screen':1838 'full-width':1321,1455 'function':64 'galleri':1548 'gap':1540,2276 'generous':173,1799 'geometr':145 'glassmorph':1727 'gpu':87,184 'gpu-rend':86 'gpu/product':1903 'gradient':511,1332,1708,1717 'gray':535,542,548,555,1385,1405,2074 'green':57,74,84,98,204,237,279,335,377,422,485,495,593,1101,1155,1260,1331,1357,1371,1391,1618,1684,1707,1821,1990,2005,2013,2033,2192,2231,2336,2394 'green-bord':334,1820,2230 'grid':1379,1447,1468,1775,1783,1875 'group':2022,2288 'guid':2026,2309 'hamburg':1834,1856 'hardwar':272,1069,1692,2440 'hardware-label':2439 'hardware-lik':1691 'head':125,318,726,740,743,772,991,1015,1018,1365,1846,1948,2045,2051,2254,2358,2420 'headlin':724,2100 'heavili':986 'height':134,315,706,1021,1185,2110,2121,2177,2188,2417 'helvetica':117,668 'hero':711,1318,1336,1458,1711,1844,1911,2095 'hierarchi':700,2431 'high':25,1826,1906 'high-contrast':24,1825 'highlight':288,429,455,613,1392,2330 'hint':1767 'horizont':1852 'hover':431,502,599,604,610,616,1120,1225,1240,1254,1263,1270,1295,2078,2087,2141,2227,2296,2402 'hover/active':2345 'icon':349,672,682,686,696 'iconographi':356 'ident':2397 'imag':1313,1319,1325,1573,1893,1901,1912,1918 'immedi':100 'impact':723 'indic':387,491,1576 'industri':122,309,1092,1378,2381 'inform':499 'inlin':1172,1188,1555,1590 'input':1564 'intensif':1227 'interact':287,343,368,573,2356 'intern':1232 'item':816,1629 'iter':2308 'kelli':97 'key':276,1394,1740 'keyboard':635,1636 'label':541,814,919,948,995,1053,1071,1388,2246,2441 'lack':143 'larg':229,391,774,848,1758,1793 'layer':1695 'layout':1380,1409,1479,1756,1792,2285 'lead':787 'lean':985 'learn':1150 'left':1281,2214 'left-align':1280,2213 'legal':946,2302 'letter':707,1076,1179 'letter-spac':1075,1178 'level':1580,1584,1593,1608,1620 'light':89,402,413,423,459,518,587,596,695,1196,1245,1704,1983,2007,2041,2053,2059,2389 'lighter':1366 'like':183,1068,1693 'lime':82,426 'lime-shift':81 'line':133,314,562,705,1020,1184,2109,2120,2176,2187,2416 'line-height':132,313,1019,1183,2108,2119,2175,2186,2415 'link':214,382,501,575,581,585,591,598,607,891,902,903,993,1052,1233,1261,1268,1286,1813,2000,2008,2077,2216,2287,2289,2401,2410 'logo':1279,2212 'lush':73 'luxuri':1509 'main':234 'maintain':174,1894,1905,1928,1957,1966,2426 'manipul':1095 'margin':1800 'materi':1700 'max':1449 'maximum':722,1796 'md':3,10 'mega':1302 'mega-menu':1301 'memori':185 'menu':1303,1835,1857 'metadata':547,930 'metric':1395 'micro':947,964,1553 'minim':259,324,1354,1646,2375 'mobil':1742,1750,1755,1757,1763,1833,1892,1946,1954 'modal':1606,1667 'modul':771 'multi':358,1873,2283 'multi-column':1872,2282 'multi-framework':357 'mute':538,1267 'name':1738 'natur':76,2017 'nav':815,918,1785,1853 'navig':901,1051,1064,1191,1274,1812,1850,2205,2433 'near':563,1568,1721,2064 'near-black':1720 'neutral':533 'never':225,388,2316 'next':1680 'none':1202 'normal':721,736,753,768,784,798,812,828,843,858,872,900,913,929,943,957,974,1079 'note':709 'nvidia':4,11,14,19,54,102,110,188,278,302,376,421,663,713,728,745,760,776,791,805,820,836,850,864,878,893,906,922,935,950,966,984,1284,1288,1486,1641,2032,2104,2171,2211,2220 'nvidia-emea':109,301,662,712,727,744,759,775,790,804,819,835,849,863,877,892,905,921,934,949,965,1287,2103,2170,2219 'often':1320 'one':1652 'opac':1145,1661 'optim':182 'orang':433 'outlin':385,633,1141,1635 'overal':266 'overlay':1333,1841 'pad':1107,1228,1432,1446,1749,1807,2138 'page':40,398,572,1588 'palett':372,420 'paragraph':788,1048,2365 'part':2444 'pattern':344,1368 'philosophi':1483,1640 'pixel':275 'placehold':553 'play':146 'plus':365 'posit':490,1400 'power':35 'pragmat':156 'precis':270 'premium/ai':513 'primari':342,374,397,661,859,1100,1148,1431,1669,2030 'primereact':361 'principl':978,1410 'print':945 'pro':677 'pro/sharp':348 'product':453,1306,1346,1470,1531,1860,2148,2269 'product/gpu':1315 'project':1010 'promin':1283 'promot':529 'prompt':2025,2092 'proport':1849,1914 'provid':1824 'punctuat':52 'pure':282,406,2042 'purpl':505,509,515,519 'purpos':1484 'px':167,264,329,881,888,1086,1175,1182,1231,1444,1539,1753,1761,1772,1780,1789,1885,1890,1960 'quick':2027 'radius':261,326,1114,1164,1210,1343,1355,1404,1551,2135,2155,2368 'rather':1545 'ratio':1896,1922 'raw':33 'read':170,800,1067 'readabl':1046 'real':179 'red':467,476,480 'reduc':1748,1886 'refer':7,2029 'reflect':1494 'regardless':2407 'regular':685,699,1389 'relat':445 'relax':752,783,827,1016,1029 'rem':717,732,749,764,780,795,809,824,840,854,868,883,897,910,926,939,954,970 'remain':1992 'remov':1259 'render':88,273,1316,1904 'reserv':1000 'resolut':1907 'respons':1735,1935 'restraint':38 'rgb':218 'rgba':250,641,1213,1595,2159 'rhythm':1512,2019 'rich':367,525 'right':2236 'right-align':2235 'ring':628,1638 'role':373,701 'round':1401,2376 'row':1382,2273 'rule':658 'run':163 'saa':1492 'san':151,670 'sans-serif':150,669 'scale':534,1134,1416,1552,1847,1897,1913,1939,1942,1950 'screen':178,1840 'screenshot':1324 'scroll':1310,2018 'secondari':450,545,829,845,1154,1167 'section':300,414,725,737,1200,1337,1440,1459,1464,1511,1514,1518,1616,1683,1724,1881,1927,1947,1973,1976,1984,2096,2242,2245,2385,2390 'select':1628 'semant':466 'sens':176 'separ':1504,1526 'serif':152,671 'sever':482 'shadow':248,637,640,652,1212,1226,1328,1587,1639,1653,1674,2158 'sharp':330,355,687,691,2374 'shift':83,602,1241,1255,1264,1271,1297,1386 'sidebar':1478 'signal':101,240,1671,2324 'signatur':56,380 'silicon':148 'simul':1703 'singl':1473,1746,1868,1878 'single-column':1472 'sit':93,1533 'site':197,1493 'size':703,1910 'skill' 'skill-design-md-nvidia' 'small':818,833,933,1743,1769 'small/compact':889 'smallest':975 'solid':212,339,630,681,1112,1132,1143,1162,1207,1252,1611,1623,1633,2084,2131,2201 'solut':1153 'source-galyarderlabs' 'space':708,1077,1180,1411,1441,1489,1501,1524,1819,1882 'span':1556 'spare':1663 'spec':1376 'special':528 'specif':62,1070 'stack':1870,1879 'standard':799,873,1559,1604,1754,1790 'stark':45 'state':432,471,489,574,617,626,2346 'status':465 'sticki':1308,2209 'strategi':1843,1974 'strong':813 'style':1098 'sub':742 'sub-head':741 'subtitl':756,2114 'subtl':559,650,1327,1384,1592 'success':488 'surfac':230,243,392,403,417,461,520,567,1688,1996 'system':6,13,249,350,1412,1644 'tab':1575 'tabl':1377 'tablet':1768,1777 'tap':1810,1970 'target':1802,1811,1829,1971 'teal':612,2088 'tech':196,1375 'technic':1498 'technolog':28,106 'technology-forward':27 'tertiari':551 'text':140,162,297,322,400,409,539,546,552,801,915,959,977,1003,1028,1056,1105,1123,1128,1139,1462,1591,1956,1965,1980,1988,2046,2052,2058,2068,2139,2144,2303,2388,2393,2425 'text-transform':914,958,1055 'theme':17 'thin':1157 'three':2268 'throughout':333,1080 'tight':130,312,720,735,767,857,871,886,942,973,1014,1025 'tighter':1488 'timestamp':931 'tini':962,1557 'tint':521 'titl':738,758,1363,2167,2196 'togeth':1535 'tone':405 'top':1040,2210 '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' 'touch':1801,1828 'track':1074 'transform':916,960,1057 'transit':1725 'transpar':1104,1159,2128,2334 'treatment':1314,1407,1581,1933 'true':394,2037 'type':1997 'typic':1491 'typograph':123 'typographi':657,1938,2442 'ui':363,976 'underlin':215,216,285,383,594,1239,1250,1258,1299,1361,2003,2011,2193,2328 'unit':1414 'uppercas':904,917,961,1049,1058,1293,1816,2224,2251,2435 'use':201,389,1054,1147,1166,1187,1487,1519,1582,1662,1804,1919,2312,2386,2391,2434 'utilitarian':1648 'valley':149 'valu':1390,1433,1654 'variant':608 'vertic':1445 'viewport':1916 'visual':16,1036,1694,2430 'voic':124,983,1065,2353,2448 'warm':436,451,460 'warn':483 'wash':1709 'websit':21 'weight':352,678,692,704,988,998,1060,1118,1176,1291,2106,2117,2173,2184,2222,2249,2257,2264,2292,2348 'white':49,295,407,580,1349,1500,1517,1682,1979,1985,2002,2043,2049,2071,2145,2150,2387 'whitespac':1482 'wider':1762 'width':1323,1451,1457,1739,1798,1900 'without':1094 'wordmark':1285 'work':2396 'yellow':447,456","prices":[{"id":"11a2ba66-17c6-4ef5-9283-e74820b9d5c1","listingId":"651af332-ed43-4e08-900a-5d27a96e7a66","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:46.734Z"}],"sources":[{"listingId":"651af332-ed43-4e08-900a-5d27a96e7a66","source":"github","sourceId":"galyarderlabs/galyarder-framework/design-md-nvidia","sourceUrl":"https://github.com/galyarderlabs/galyarder-framework/tree/main/skills/design-md-nvidia","isPrimary":false,"firstSeenAt":"2026-05-10T01:06:46.734Z","lastSeenAt":"2026-05-18T19:07:48.134Z"}],"details":{"listingId":"651af332-ed43-4e08-900a-5d27a96e7a66","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"galyarderlabs","slug":"design-md-nvidia","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":"eaac21d2ef6d682f74cd9b1e8b04d226c30af449","skill_md_path":"skills/design-md-nvidia/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/galyarderlabs/galyarder-framework/tree/main/skills/design-md-nvidia"},"layout":"multi","source":"github","category":"galyarder-framework","frontmatter":{"name":"design-md-nvidia","description":"Design system reference for design md nvidia."},"skills_sh_url":"https://skills.sh/galyarderlabs/galyarder-framework/design-md-nvidia"},"updatedAt":"2026-05-18T19:07:48.134Z"}}