justin/hpe-branding
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial mirror of the HPE Design System

Browse Source 
Readable mirror of https://design-system.hpe.design, sourced from
github.com/grommet/hpe-design-system (Apache-2.0) at commit 567c4d5
(2026-07-16).

The upstream site is a client-rendered Next.js export with no sitemap; it
returns a 1.5 KB empty shell to curl. This repo is the same guidance in plain
Markdown with every value resolved, plus the assets checked in.

Docs: scope and authority model, brand foundations with resolved color and
spacing tables, the design token tiers and version map, UI copy rules,
accessibility conformance and the responsibility split, the component and
template inventory, and an adoption/review checklist.

Assets: 452 SVG icons, 5 HPE and Aruba word-marks, 282 documentation graphics.

HOWTO-mirror-the-design-system.md is a verified runbook for rebuilding this
from scratch against a newer upstream.

Colors were resolved programmatically, not transcribed: token JSON stores
references, not values.

Apache-2.0 upstream. Note that it covers copyright, not trademark; Brand
Central remains authoritative for the HPE marks.
This commit is contained in:
claude
2026-07-30 08:34:50 -04:00
commit 0730557624
752 changed files with 8423 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/site-images/extendImages/extend-preview-grommet-invert.svg
+20
View File
@@ -0,0 +1,20 @@
<svg width="336" height="192" viewBox="0 0 336 192" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="336" height="192" fill="#552B9D"/>
<path d="M214.068 37.871C219.532 42.2723 222.647 49.6385 217.775 55.6234C212.904 61.6083 201.852 65.1973 195.796 60.3182C189.739 55.4391 190.97 43.9394 195.842 37.9545C200.714 31.9696 208.605 33.4697 214.068 37.871Z" fill="#885BDF"/>
<path d="M117.869 56.1079C112.989 50.1043 116.079 42.7401 121.521 38.35C126.963 33.9599 134.836 32.4803 139.716 38.484C141.521 40.7043 142.831 43.6781 143.46 46.7906C162.504 40.5518 198.569 43.1156 203.623 54.482C207.214 62.5581 209.516 88.4036 210.957 114.086C211.55 124.652 211.997 142.789 212.329 152.051C212.954 169.527 212.847 191.92 212.847 191.92H123.46C123.46 191.92 123.017 169.527 123.641 152.051C123.971 142.789 124.417 124.652 125.009 114.086C126.11 94.4462 127.713 74.7109 130.013 62.8998C125.341 62.1265 120.624 59.4964 117.869 56.1079Z" fill="#9060EB"/>
<path d="M201.314 191.92C199.994 173.31 185.501 164.876 168.007 164.876C150.561 164.876 136.381 173.419 134.994 191.92H201.314Z" fill="#6CF5AA"/>
<path d="M165.381 168.518C161.785 167.061 158.899 164.992 156.724 162.312C159.783 163.559 164.354 164.475 170.438 165.062C179.564 165.942 178.207 173.37 165.381 168.518Z" fill="#6CF5AA"/>
<path d="M203.444 54.5373C206.617 61.6577 209.272 85.5989 210.834 113.04C212.396 140.481 212.847 191.92 212.847 191.92H188.05C188.57 182.884 188.189 174.551 186.258 168.676C181.032 152.771 174.932 152.332 168.336 146.95C161.739 141.568 188.258 150.96 186.258 122.449C190.342 105.25 179.255 93.1624 176.408 86.7999C171.73 76.3415 184.562 71.9074 184.562 64.7596C184.562 56.5396 187.611 45.8354 168.336 43.4675C193.716 44.4292 201.329 49.793 203.444 54.5373Z" fill="black" fill-opacity="0.05"/>
<path d="M212.904 177.909C213.011 171.823 213.982 165.78 215.818 159.779C211.185 162.671 208.818 167.008 208.717 172.789C208.565 181.461 212.744 187.038 212.904 177.909Z" fill="#885BDF"/>
<path d="M189.275 82.9704C185.06 87.1675 187.871 94.7815 184.367 91.2918C180.862 87.8021 180.856 82.1498 184.354 78.667C187.852 75.1842 193.528 75.1898 197.033 78.6796C200.538 82.1693 193.49 78.7732 189.275 82.9704Z" fill="#7A52C7"/>
<path d="M147.56 88.7701C151.775 84.573 148.964 76.959 152.468 80.4487C155.973 83.9384 155.979 89.5907 152.481 93.0735C148.983 96.5562 143.307 96.5506 139.802 93.0609C136.297 89.5712 143.344 92.9672 147.56 88.7701Z" fill="#976AEB"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M145.082 92.0692C141.738 92.0692 139.027 89.4163 139.027 86.1438C139.027 82.8714 141.738 80.2185 145.082 80.2185C148.426 80.2185 151.137 82.8714 151.137 86.1438C151.137 89.4163 148.426 92.0692 145.082 92.0692ZM168.293 101.945C166.275 101.945 161.229 99.052 161.229 95.7795C161.229 92.507 164.949 92.0693 168.293 92.0693C171.637 92.0693 175.357 92.507 175.357 95.7795C175.357 99.052 170.312 101.945 168.293 101.945ZM185.449 86.1439C185.449 89.4164 188.16 92.0692 191.504 92.0692C194.848 92.0692 197.559 89.4164 197.559 86.1439C197.559 82.8714 194.848 80.2186 191.504 80.2186C188.16 80.2186 185.449 82.8714 185.449 86.1439Z" fill="#333333"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M189.252 82.9556C188.411 82.9556 187.729 83.6237 187.729 84.4478C187.729 85.2719 188.411 85.94 189.252 85.94C190.093 85.94 190.774 85.2719 190.774 84.4478C190.774 83.6237 190.093 82.9556 189.252 82.9556ZM141.728 84.4478C141.728 83.6237 142.41 82.9556 143.251 82.9556C144.092 82.9556 144.773 83.6237 144.773 84.4478C144.773 85.272 144.092 85.9401 143.251 85.9401C142.41 85.9401 141.728 85.272 141.728 84.4478ZM166.025 96.0606C164.644 96.0606 163.525 95.6085 163.525 95.0508C163.525 94.4931 164.644 94.041 166.025 94.041C167.406 94.041 168.525 94.4931 168.525 95.0508C168.525 95.6085 167.406 96.0606 166.025 96.0606Z" fill="white" fill-opacity="0.3"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M194.599 71.6066L195.816 72.3819C193.068 71.9266 190.832 71.577 189.106 71.3329L188.211 71.2895C182.747 71.0256 178.892 71.0063 178.892 71.0063C178.715 71.0048 178.563 70.8631 178.552 70.682L178.125 63.7405C178.062 63.2809 177.917 62.4936 177.692 61.3787L182.413 63.864L182.439 63.8681L181.993 62.9364L185.527 64.3715L185.528 64.389C186.582 64.5818 187.707 64.8034 188.869 65.0558C194.541 66.2874 199.234 67.6653 199.234 67.6653C199.405 67.7145 199.506 67.8939 199.46 68.0657L198.552 71.4957C198.507 71.6676 198.326 71.7993 198.151 71.7901C198.151 71.7901 196.767 71.717 194.599 71.6066ZM135.806 68.0465L134.653 67.7907L138.084 66.9759C139.898 66.4639 142.735 65.7012 145.893 64.9903C146.861 64.7725 147.802 64.5786 148.693 64.4068L148.143 63.8296H151.708L150.219 62.8806H155.401C155.896 62.8806 156.08 63.1201 156.134 63.4424C156.154 63.4828 156.164 63.5299 156.161 63.5812L156.153 63.7419C156.152 63.7709 156.151 63.8002 156.15 63.8296C156.15 63.8394 156.149 63.8493 156.147 63.8592L155.793 70.8111C155.784 70.9859 155.633 71.1295 155.456 71.1298C155.456 71.1298 151.787 71.1232 146.566 71.3552C141.345 71.5872 137.084 71.7974 137.084 71.7974C136.907 71.8061 136.728 71.6737 136.685 71.5018L135.806 68.0465ZM162.626 133.564C162.626 134.124 163.083 134.577 163.647 134.577H172.716C173.28 134.577 173.737 134.124 173.737 133.564C173.737 133.005 173.28 132.552 172.716 132.552H163.647C163.083 132.552 162.626 133.005 162.626 133.564Z" fill="#6D49B2"/>
<path d="M167.64 126.892C186.407 126.892 201.622 120.572 201.622 112.636C201.622 104.699 186.407 110.235 167.64 110.235C148.872 110.235 133.658 104.699 133.658 112.636C133.658 120.572 148.872 126.892 167.64 126.892Z" fill="#8F2E2E"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M189.816 113.652C191.04 113.652 192.02 110.164 192.509 108.357C190.55 108.357 187.122 108.808 187.122 108.808C187.133 108.846 187.145 108.884 187.157 108.924C187.658 110.542 188.62 113.652 189.816 113.652ZM148.918 108.808C148.918 108.808 145.489 108.357 143.53 108.357C144.02 110.164 144.999 113.389 146.224 113.389C147.448 113.389 148.428 110.39 148.918 108.808Z" fill="white"/>
<path d="M168.779 112.139C180.627 112.139 190.231 114.513 190.231 118.904C190.231 124.92 180.627 126.135 168.779 126.135C156.931 126.135 147.327 126.025 147.327 118.904C147.327 114.513 156.931 112.139 168.779 112.139Z" fill="#7F2828"/>
<path d="M157.578 112.888C161.702 112.398 166.705 113.129 167.41 115.315C168.114 117.5 166.47 118.169 166.486 119.66C166.502 121.151 167.499 121.975 168.585 121.975C169.636 121.975 170.634 121.151 170.65 119.66C170.666 118.169 169.021 117.5 169.726 115.315C170.431 113.129 176.554 112.376 179.98 112.888L177.855 111.383H159.232L157.578 112.888Z" fill="#8F2E2E"/>
<path d="M181.119 125.614C181.121 125.332 179.57 124.158 174.733 123.265C171.342 122.64 169.703 124.101 168.998 124.101C168.293 124.101 166.514 122.64 163.124 123.265C158.286 124.158 156.439 125.63 156.439 125.614C165.855 126.508 171.127 127.085 181.119 125.614Z" fill="#AE3939"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M190.388 112.245C191.18 112.245 191.813 109.683 192.13 108.357C190.863 108.357 188.646 108.688 188.646 108.688C188.654 108.716 188.662 108.744 188.669 108.773C188.993 109.961 189.615 112.245 190.388 112.245ZM148.927 108.829C148.927 108.829 148.43 108.702 147.185 108.605C147.35 109.296 147.199 110.535 147.074 111.563C146.959 112.508 146.865 113.274 147.059 113.274C147.462 113.274 148.61 109.989 148.927 108.829Z" fill="black" fill-opacity="0.05"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 7.2 KiB