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

Components

AirportIllustration Communicates information about specific airports in an interesting visual way.
React
Alert Breaks the main user flow to present information.
Figma React
Badge Presents users with short, relevant information.
Figma React
Breadcrumbs Shows where the user is within the app hierarchy.
React
Button Displays a single important action a user can take.
React
ButtonGroup Groups multiple related actions a user can take.
React
ButtonLink Displays a single, less important action a user can take.
React
ButtonMobileStore Encourages users to get an app from a store.
React
CallOutBanner Encourages users to take an action to add additional services or the like.
React
Card Groups static content to make it easy to scan.
React
CarrierLogo Displays logos of transport carriers.
React
Checkbox Enables users to pick multiple options from a group.
React
ChoiceGroup Organizes checkboxes or radio buttons into a single related group.
React
Collapse Hides long or complex information under a block that can be hidden.
React
CountryFlag Displays flags of countries from around the world.
React
Coupon Highlights promo codes.
React
Desktop Shows content only on desktop viewports.
React
DestinationCard Deprecated in favor of the more general PictureCard.
DestinationHeader Deprecated and not recommended for designs. We do have the more general PictureCard.
Dialog Prompts users to take or complete an action.
React
Drawer Wraps navigation or other content in a sidebar.
React
EmptyState Indicates when there’s no data to show, like when a search has no results.
FeatureIcon Draws attention to specific features.
React
Grid Implements a CSS grid valid even in older browsers.
React
Heading Shows the content hierarchy and improves the reading experience.
React
Hide Hides content based on the viewport size.
React
Icon Draws attention to specific actions and features.
React
Illustration Communicates information in an interesting visual way.
React
InputField Offers users a simple input for a form.
React
InputFile Enables users to upload a file to complete a form.
React
InputGroup Combines related inputs for a form.
React
InputStepper Enables incremental changes of a counter within a form.
React
Layout Displays content in a responsive column layout.
React
LinkList Groups related links, such as in a navigation menu.
React
List Shows related items.
React
ListChoice Shows one of a selectable list of items with similar structures.
React
Loading Lets users know that content is being loaded.
React
Mobile Shows content only on mobile viewports.
React
Modal Forces users to complete an action before continuing.
React
NavigationBar Wraps top-level navigation and branding.
React
NavigationList Deprecated in favor of LinkList.
NotificationBadge Shows simple, non-interactive information.
React
Pagination Lets users navigate through large collections of items.
React
PictureCard Displays a card with a picture and space for information and actions.
React
Popover Keeps additional content easily accessible while not cluttering up the page.
React
PricingTable Helps users understand different pricing plans to choose from.
React
Radio Enables users to pick exactly one option from a group.
React
RatingStars Shows a static rating of a service such as a hotel.
React
Seat Presents options for seating.
React
Select Offers a simple form control to select from many options.
React
Separator Separates content into sections.
React
ServiceLogo Presents a logo for a common service.
React
Slider Enables selection from a range of values.
React
SocialButton Lets users sign in using a social service.
React
Stack Lay out components with consistent spacing in a row or column.
React
Stepper Enables incremental changes of a counter without a direct input.
React
StopoverArrow Shows how many stopovers there are between two locations.
React
Table Creates a table for your tabular content.
React
Tabs Separates content into groups within a single context.
Tag Offers a label that can optionally be selected and unselected or removed.
React
Text Renders text blocks in styles to fit the purpose.
Figma React
Textarea Enables users to add longer text to a form.
React
TextLink Makes text in paragraphs actionable.
React
Tile Groups actionable content to make it easy to scan.
React
TileGroup Wraps tiles to show related interactions.
React
Toast Shows a brief and informative temporary message.
Tooltip Shows additional context on tap or hover.
React
TripSector Deprecated in favor of the forthcoming ItinerarySector.
TripSegment Deprecated in favor of the forthcoming ItinerarySegment.
Wizard Nudges users to complete several steps.