Home Overview
Overview
Data Display Feedback Form Inputs General Layout Navigation Charts Others Up coming
Accordion
Data Display
An accordion is a vertically stacked list of headers that reveal or hide associated sections of content. Read more
Avatar
Data Display
The Avatar component is used to represent user, and displays the profile picture, initials or fallback icon. Read more
Badge
Data Display
The badge component is used to display a small amount of information to the user. Read more
HomePage Breadcrumb
Navigation
A breadcrumb is a secondary navigation scheme that reveals the user's location in a website or web application. Read more
Button CTA Button
General
An interactive button with a range of presentation options. Read more
Button Group
General
Group a series of buttons together on a single line with the button group, and super-power. Read more
Calendar
Data Display
The calendar component is used to display information in a daily, weekly, monthly, or category view. Read more
Chart Doughnut
Charts
A doughnut chart is a circular chart with a blank center. The chart is similar to a pie chart with the center cut out. The area in the center can be used to display information. Read more
Chart Pie
Charts
A pie chart (also known as a circle chart) is a circular statistical graphic that visually represents numerical proportions. It is commonly used to illustrate how parts relate to the whole for a specific categorical variable. Read more
Want ice cream? Checkbox
Form Inputs
Captures boolean input with an optional indeterminate mode. Read more
Code Editor
Form Inputs
A browser based code editor. Read more
Code Highlighter
Data Display
A browser based code highlighter. Read more
Current Time
Others
Displays the current time in a given timezone. Read more
Date Picker
Form Inputs
Captures date input. Read more
or Divider
Layout
A divider can be used to segment content vertically or horizontally. Read more
Dropdown
Navigation
Enables native inputs to be used within a Form field. Read more
Empty State
Data Display
A message that displays when there is no information to display. Read more
Footer
Navigation
The footer component provides a container for displaying additional navigation information about a site. Read more
Form Control
Form Inputs
The Form Control component adds a label and caption for its child control. Read more
Header
Navigation
Header component is used to display a header with a brand, navigation, and actions. Read more
Icon
General
Icons are visual symbols used to represent ideas, objects, or actions. Read more
Input
Form Inputs
Enables native inputs to be used within a Form field. Read more
Link Link
Navigation
Links allow users to click their way from page to page. Read more
Menu
Navigation
Menus display a list of choices on temporary surfaces. Read more
Modal
Feedback
Modals are used to display content in a layer above the app. Read more
Successful saved the record
Notification
Feedback
Notifications are messages that communicate information to the user. Read more
Notification Manager
Feedback
Manages alert, toasts and notifications. Read more
Number
Form Inputs
Number input lets users enter a numeric value and incrementally increase or decrease the value with a two-segment control. Read more
Progress
Feedback
Progress indicators express an unspecified wait time or display the length of a process. Read more
Select
Form Inputs
Allows the user to select one or more options using a dropdown. Read more
Slider
Form Inputs
Sliders allow users to make selections from a range of values. Read more
Spinner
Feedback
Spinners provide a visual cue that an action is processing awaiting a course of change or a result. Read more
SVG
Data Display
Render SVG content from an external source. Read more
Table
Data Display
A configurable component for displaying tabular data. Read more
Tab 1 Tab 2 Tabs
Navigation
The tabs component is used to display multiple panels of content in a container. Read more
Important Tag
Data Display
Use tags to label, categorize, or organize items using keywords that describe them. Read more
Heading Text
General
Typography are used for rendering headlines, paragraphs and captions. Read more
Textarea
Form Inputs
Enables native inputs to be used within a Form field. Read more
Time Picker
Form Inputs
Captures time input. Read more
Toast
Feedback
Toasts are lightweight notifications. Read more
Want ice cream? Toggle
Form Inputs
Captures boolean input with an optional indeterminate mode. Read more
Tooltip
Data Display
The Tooltip component is used to display additional information on hover. Read more
TreeView
Navigation
A tree view is a hierarchical structure that provides nested levels of navigation. Read more
Upcoming
Canvas
Up coming
Canvas for drawing lines and shapes on. Read more
Condition Builder
Up coming
A condition builder is a component that allows users to build a condition using a set of rules. Read more
Flow Designer
Up coming
Flow Designer is a component that allows users to create and edit flows. Read more
HTML Editor
Up coming
HTML Editor component is a WYSIWYG editor that allows users to edit HTML content. Read more