← Palettes · [email protected]

Unreal Engine

Unreal Engine's brand palette as captured from the live unrealengine.com Epic Design System ("EDS") tokens — including the --color-eds.palette.blue.* family (the signature Unreal blue ramp), the --color-eds.fill.primary.* family (default brand action), the --color-background-default ink canvas, and the --color-fill-critical.* and --color-fill-success.* status channels. The brand is dark-first by construction: a deep ink canvas (#101014) carries the chrome, with the signature Unreal Blue (#26BBFF) as the primary action color across the design system. The blue ramp is fully calibrated for both light and dark contexts — #0A2633 deep through #D6F2FF pale — and the brand reads as engineering-precise and cinematic.

25 swatches 15 light roles 15 dark roles unreal-engineepic-gamesgamingenginereal-time-3ddark-firstblue

Swatches

unreal-blue

#26BBFF

Primary brand action — --color-eds.fill.primary.default, --color-eds.icon.select.default, --color-text-select- default, --color-fill-primary-press. The most identifiable Unreal Engine accent.

unreal-blue-hover

#72D3FF

Hover variant — --color-eds.fill.primary.hover and --color-fill-primary-hover.

unreal-blue-400

#33BFFF

Mid-bright blue — --color-eds.palette.blue.400 (alias of --color-palette-blue-400).

unreal-blue-500

#69D0FF

Bright blue — --color-eds.palette.blue.500.

unreal-blue-600

#A0E1FF

Pale blue — --color-eds.palette.blue.600. Gradient start-stop in the green-gradient (#A0E1FF → #5FE367).

unreal-blue-700

#D6F2FF

Lightest blue — --color-eds.palette.blue.700. Quiet branded surface tint.

unreal-blue-300

#258CBB

Mid-deep blue — --color-eds.palette.blue.300.

unreal-blue-200

#185977

Deep blue — --color-eds.palette.blue.200.

unreal-blue-100

#0A2633

Deepest blue surface — --color-eds.palette.blue.100.

ink

#101014

Primary dark canvas — --color-background-default and --color-neutral-100. The Unreal Engine page-background default.

ink-elevated

#202024

Elevated dark surface — --colors-eds.background.elevated. high.default. Card and panel backgrounds.

ink-elevated-hover

#505054

Tertiary elevated hover — --colors-eds.fill.tertiary. elevated.hover.

ink-divider

#303034

Quiet divider on dark — --color-fill-secondary-disabled and --colors-eds.fill.secondary.disabled.

ink-deep

#000000

Pure black — --colors-eds.text.on-accent and --colors- eds.text.link.on-accent.default. Text fill on bright blue and white surfaces.

snow

#FFFFFF

Pure white — --color-text-primary, --color-icon-primary, --colors-eds.icon.contrast. Primary body text on dark canvas.

snow-soft

#808084

Mid neutral — --colors-eds.palette.grayscale.gray100. Secondary text on dark surface.

critical-default

#FF3F56

Error / destructive default — --color-fill-critical- default and --colors-eds.fill.critical.default.

critical-alternate

#FF6173

Critical alternate — --color-fill-critical-alternate. Used as the warning text color on critical alerts.

critical-text

#FF6173

Critical text color — --colors-eds.text.critical.

success-default

#8AEA90

Success green — --colors-eds.palette.green.500.

success-alternate

#71D687

Success alternate — --color-fill-success-alternate.

warning-default

#FFC229

Warning icon color — --color-icon-warning and --color- palette-accent-yellow200.

warning-yellow-400

#F7D82B

Bright warning yellow — --colors-eds.palette.yellow.400.

gradient-green

#5FE367

Green gradient end-stop — --gradient-components-green- stops-100. Paired with --gradient-components-blue-stops- 100 (#33BFFF or unreal-blue-600 #A0E1FF) on the documented EDS gradients.

gradient-orange

#FE8539

Orange gradient end-stop — --color-palette-orange-400. Paired with yellow on the documented EDS orange gradient.

Mode role mappings

Light mode (15 roles)

accent → unreal-blue-300

accent-hover → unreal-blue-200

background → snow

border → ink-divider

error → critical-default

primary → unreal-blue-200

primary-hover → unreal-blue-300

success → success-alternate

surface → unreal-blue-700

surface-elevated → snow

text-primary → ink

text-secondary → ink-elevated-hover

text-tertiary → snow-soft

warning → warning-default

warning-hover → gradient-orange

Dark mode (15 roles)

accent → unreal-blue-hover

accent-hover → unreal-blue-500

background → ink

border → ink-divider

error → critical-default

primary → unreal-blue

primary-hover → unreal-blue-hover

success → success-default

surface → ink-elevated

surface-elevated → ink-elevated-hover

text-primary → snow

text-secondary → snow-soft

text-tertiary → ink-elevated-hover

warning → warning-default

warning-hover → gradient-orange

Provenance

Source: https://www.unrealengine.com/
Attribution: Epic Games, Inc. — palette values captured from the deployed Epic Design System ("EDS") tokens on unrealengine.com (--colors-eds.palette.*, --color-fill-*, --color-background-*, --color-text-*, --color-palette-* CSS custom-property families plus the gradient-component stops --gradients-eds.gradient.*). Unreal, Unreal Engine, the Unreal Engine logo, and associated marks are trademarks of Epic Games, Inc.
Imported: 2026-05-19
Notes: Derived from live site CSS at https://www.unrealengine.com/ on 2026-05-19. The Unreal Engine brand documentation (https://www.unrealengine.com/en-US/branding) is the canonical Epic Games / Unreal Engine identity reference; the captured live-site tokens align with the Epic Design System that underpins the brand-asset center. The primary typeface is Inter (--font-family-base / --fonts-eds.family.base = "Inter, sans-serif"); the display typeface is Inter Tight (--font-family-display / --fonts-eds.family.display); the monospace family is Recursive Mono (--font-family-code / --fonts-eds.family.code). All three are open-source and available in this catalog as inter@1, inter-tight@1, and (Recursive Mono not yet catalogued, substituted with jetbrainsmono-nerdfont@1 in the brand atom).