Skip to content



Logo renders the official logo for the United Nations World Data Forum.


Logo needs to be rendered inside a container that sets height or width explicitly. You can scale the logo to height or to width.

In this example we scale to height:

In this example we scale to width:

We can set the monochrome flag to render the logo with its parent's color:

System props

Logo does not support system props. This is because it always needs to be defined in a container that defines height or width. You can use Box as container, which supports space props and color props from Styled System.

Component props

scaleToheight or widthIndicate whether to scale the logo to height or to width.
monochromeBooleanfalseRender logo monochrome if true.

Visual regression testing

The following URLs can be used for visual regression testing:

Edit this page on GitHub
1 contributormaiertech
Last edited by maiertech on July 7, 2020