Skip to content
  • There are no suggestions because the search field is empty.

Content component reference

Discover which content components the default set has to offer and what they are capable of

You can use the content components to apply different types of content. For example, to include a carousel of images.

downloads.intercomcdn.comio44235526200a1765c21f55675ea0cce8cContent_Pages_Components_-1

The content components are used for applying different types of content on your web pages.

As shown, these vary from specifying Title text to an Avatar for your application.

Each component can be customized using the component specific options in the Options menu displayed when you select a component.

The following content components are available:

Title

betty-blocks.intercom-attachments-1.comio3939878567d49ab0592b0b0be068bab945df7b4a584901eb9d0b2060ac2173767-Title-1

You can use the predefined Title components to create consistent title text for your application.

Text

betty-blocks.intercom-attachments-1.comio393987851664b8a1c33a07d0bed32e0988576be954cbe7d5f4777245b423e06f3-Paragraph-1

Text components are text with predefined options that display them in a body text format.

Alert

betty-blocks.intercom-attachments-1.comio393987859b6f25a46c36ab7cb17b40433c65ac333a6436b7915053bf1721a0370-Alert-1

Alert components are pop up windows with a message inside of them. They can be used to notify/alert users.

Icon

 

downloads.intercomcdn.comio442380954488472f7df3d00c2c43e998bimage-1

Icon components are icons that can be placed inside of many different components. All icons are retrieved from the MaterialUI website.

Divider

betty-blocks.intercom-attachments-1.comio393987879af56ca9b98851a2bfa8322625ba637bdf60fb6494cc852fb91dac37d-Horizontal_rule-1

Divider components are used to separate components from each other and create a layout.

Snackbar

 

downloads.intercomcdn.comio44235860464f1402012676717a8bda42fimage-1

Snackbar component is used to create a brief feedback message to a user. The message is displayed for a specified period, normally a matter of seconds, as a type of nod to an end user.

Progress Bar

betty-blocks.intercom-attachments-1.comio3939878947bb51ff43a564cc80e6607b1217f89468604dae8ea8333695db8d94d-Progress_bar-1

Progress Bar components display progress based on specified values.

Media

downloads.intercomcdn.comio442358665274ff17499141b2a850803f3image-1

Media components are used to display images on your page.

The link address of the image that you want to display.

Dialog

downloads.intercomcdn.comio44235875947d3a2647813328ef8f4c6f6image-1

Dialog component is used for building a pop-up window that you can customize. For example, to request information, such as an email address.

Chip

downloads.intercomcdn.comio442358835bc553327ef215b4b0f2b8169image-1

Chip components are labels that display text. Often used to show multiple values in a single component, e.g. a multi-optional filter.

Avatar

downloads.intercomcdn.comio4423589637884fa12362b121bea1fc4b1image-1

Avatar components are avatars that can contain either an image, a letter, or an icon. Often used as profile pictures or to distinguish categories.

Carousel

downloads.intercomcdn.comio44235907696a100c409324cec8cedba2cimage-1

Carousel component can be used for displaying a series of images.

Carousel Image

downloads.intercomcdn.comio4423591358fb0e729aca84e20e5d1322fimage-1

Used for including various images in a Carousel component.