Files
hpe-branding/assets/site-images/404-pile-invert.svg
T
claude 0730557624 Initial mirror of the HPE Design System
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.
2026-07-30 08:34:50 -04:00

35 lines
3.6 KiB
XML

<svg width="774" height="422" viewBox="0 0 774 422" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="596.076" y="203.62" width="185" height="115" rx="14.439" transform="rotate(16.7151 596.076 203.62)" fill="#17EBA0"/>
<rect x="599.371" y="202.611" width="77" height="115" rx="14.439" transform="rotate(-15.0735 599.371 202.611)" fill="#FFD63E"/>
<rect x="174.393" y="205.62" width="121" height="119" rx="14.439" transform="rotate(12.321 174.393 205.62)" fill="#FF8300"/>
<rect x="251.692" y="74.9877" width="279.439" height="278.439" rx="21.6585" transform="rotate(-14.8931 251.692 74.9877)" stroke="#00739D" stroke-width="14.439"/>
<rect x="391" y="227.62" width="121" height="121" rx="14.439" fill="#00C8FF"/>
<path d="M569 243.345H631.076" stroke="#4F5F76" stroke-width="4" stroke-linecap="round"/>
<path d="M662.725 243.345H690.314" stroke="#4F5F76" stroke-width="4" stroke-linecap="round"/>
<path d="M569 275.886H729.502" stroke="#4F5F76" stroke-width="4" stroke-linecap="round"/>
<path d="M569 305.138H649.893" stroke="#4F5F76" stroke-width="4" stroke-linecap="round"/>
<path d="M675.723 305.142H689.517" stroke="#4F5F76" stroke-width="4" stroke-linecap="round"/>
<path d="M596.322 336.904L728.648 336.904" stroke="#4F5F76" stroke-width="4" stroke-linecap="round"/>
<path d="M628.075 368.654L696.884 368.654" stroke="#4F5F76" stroke-width="4" stroke-linecap="round"/>
<path d="M250.217 181.544L311.799 173.726" stroke="#4F5F76" stroke-width="4" stroke-linecap="round"/>
<path d="M343.196 169.741L370.565 166.266" stroke="#4F5F76" stroke-width="4" stroke-linecap="round"/>
<path d="M254.315 213.827L413.539 193.614" stroke="#4F5F76" stroke-width="4" stroke-linecap="round"/>
<path d="M257.999 242.846L338.248 232.658" stroke="#4F5F76" stroke-width="4" stroke-linecap="round"/>
<path d="M363.873 229.409L377.557 227.671" stroke="#4F5F76" stroke-width="4" stroke-linecap="round"/>
<path d="M289.104 270.917L420.376 254.253" stroke="#4F5F76" stroke-width="4" stroke-linecap="round"/>
<path d="M324.603 298.416L392.864 289.75" stroke="#4F5F76" stroke-width="4" stroke-linecap="round"/>
<rect y="238.351" width="121" height="121" rx="14.439" transform="rotate(-24.2676 0 238.351)" fill="#F740FF"/>
<path d="M536.521 171.807L507.889 152.679L395.626 232.273L423.385 250.819L444.733 235.118L483.666 261.128L477.507 286.976L505.965 305.988L536.521 171.807ZM468.639 217.854L499.758 195.086L490.637 232.55L468.639 217.854Z" fill="#C0CADC"/>
<path d="M596.401 292.131L589.656 302.228C588.316 297.052 582.495 288.379 574.464 283.014C557.878 271.933 538.445 273.051 528.792 287.5C518.558 302.819 525.197 320.851 541.084 331.465C550.163 337.53 560.869 338.892 565.93 337.741L562.092 343.486L574.837 352L609.844 299.601C620.777 283.237 616.698 265.909 598.366 253.662C588.764 247.246 577.65 243.85 569.97 244.007L561.712 256.367C570.963 256.504 579.691 258.558 588.246 264.274C599.594 271.855 602.798 282.556 596.401 292.131ZM580.235 316.329L574.886 324.336C568.953 328.682 558.712 327.379 550.506 321.897C541.079 315.599 534.908 305.182 541.188 295.781C547.352 286.555 559.222 288.442 568.65 294.74C576.855 300.222 581.978 309.184 580.235 316.329Z" fill="#C0CADC"/>
<g clip-path="url(#clip0_6_438)">
<circle cx="350.007" cy="275.87" r="12" transform="rotate(-1.03471 350.007 275.87)" fill="#F740FF"/>
<circle cx="386.001" cy="275.22" r="12" transform="rotate(-1.03471 386.001 275.22)" fill="#F740FF"/>
<circle cx="421.995" cy="274.57" r="12" transform="rotate(-1.03471 421.995 274.57)" fill="#F740FF"/>
</g>
<defs>
<clipPath id="clip0_6_438">
<rect width="107" height="25" fill="white" transform="translate(337.783 263.588) rotate(-1.03471)"/>
</clipPath>
</defs>
</svg>