Skip to content

Logo

The Zurich logo is the visual foundation of the entire Zurich brand. With refreshed colors, our logo stands in tradition with added warmth and optimism. We use our logo proudly to mark all our words and actions.

UX/UI Guidelines

Check the design documentation of the component in ZeroHeight.

From Figma to code

...

Customization

INFO

Check everything about the customization mechanics in the "How it works" documentation.

CSS VariableTypeDescription
--z-logo--fillcolorFill color
--z-logo--sizedistanceSize of logo

The fill and size of the logo can be customized using the --z-logo--fill and --z-logo--size CSS custom properties respectively or the custom attribute.