Developer mode
Opens components on the React tab by default.
Your bookmarks

Illustration / React

Communicates information in an interesting visual way.

To implement Illustration component into your project you’ll need to add the import:

import Illustration from "@kiwicom/orbit-components/lib/Illustration";

After adding import into your project you can use it simply like:

<Illustration name="Accommodation" size="small" />


Table below contains all types of the props available in Illustration component.

Name Type Default Description
alt string Optional property for passing own alt attribute to the DOM image element. Bby default, the name of illustration is used.
dataTest string Optional prop for testing purposes.
name enum Name for the displayed illustration.
size enum "medium" The size of the Illustration.
spaceAfter enum Additional margin-bottom after component. See this docs


name size
"Accommodation" "extraSmall"
"AirHelp" "small"
"AirportTransport" "medium"
"AirportTransportTaxi" "large"
"AirportShuttle" "display"