Index

Actions

Action Bar

An Action Bar is a UI element at the top of interfaces, …

Button Group

Group of selection options in button format which can be multiple or …

Button Icons

Button Icons are used for minor actions that can be resumed within …

Buttons

Buttons are used to perform an action. Their labels tell the user …

Close

Dismiss components with a clear Close icon. Accessible, and enhancing usability across …

Overflow Menu

An overflow menu is a UI component that houses secondary options or …

Split button

A split button is a button with a main action and related …

Switch

A switch is a versatile toggle control for switching between two states …

Cards

Cards are boxes that group together a set of related information …

Counter

A counter pattern is a dashboard element that highlights key metrics, offering …

Data Grid

Data Grids are used to efficiently organize information and make it easier …

Divider

Dividers are visual elements that separate content into distinct sections, enhancing organization …

Expander

The Expander pattern organizes content into expandable panels, improving navigation and usability …

Formula Editor

The Formula Editor is an interface element that allows users to input, …

Label

A Label serves as a crucial element for enhancing the clarity and …

Sortable List

A sortable list is a feature that enables users to move items …

Search

A Search component enhances user experience by enabling quick, intuitive, and refined …

Forms

Não foram encontrados artigos.

Foundations

Accent Icons

Accent Icons in UX serve as graphical representations of concepts, actions, or …

Color

Colors infuse life and dynamism into interfaces, expressing emotions and setting the …

Corner Radius

Corner radius helps make UI personable, easier to process, and recognizable at …

Font System

A type system is a comprehensive set of guidelines and specifications governing …

Grid

A grid layout is a way to organize content on a page …

Icons

Icons are visual metaphors used to represent objects, actions or ideas …

Layout

The layout of an interface serves as the foundation for creating interactive …

Shadows

Shadows give surfaces a sense of depth, direction and movement. This is …

Sizings

Compose uses standard sizes and spacing created from increments of 8 to …

Spacing

Spacing provides structural references to help you create components and compose pages …

Badge

A Badge is a small visual element used to highlight information, such …

Chips

Chips are small visual elements commonly used in user interfaces to represent …

Status Indicator

Status Indicators provide visual cues to convey the status of an element …

Tooltip

Tooltips are used to provide additional information about elements or functionalities on …

Checkbox

A checkbox is an essential UI element that allows users to make …

Date Pickers

Date Pickers are user interface elements that allow users to select dates …

Input Mask

An Input Mask, in UX, guides users by providing a predefined format …

Numeric

A numeric component is an input field specifically designed for entering numeric …

Password

A password component in UX facilitates the creation and input of secure …

Radio Button

A Radio Button component allows users to select one option from a …

Range Slider

A Range Slider component enables users to interactively select a value or …

Select Box

The Select Box component allows users to make selections from a predetermined …

Text Area

A Text Area is a multi-line input field in UX, allowing users …

Text Field

A Text Field component in UX provides users with a space to …

Time Pickers

Time Pickers assist users in selecting and setting a specific time …

File Uploader

A versatile uploader pattern for seamless file or image uploads within modals …

Image Uploader

A simple image uploader for quick and easy uploads, offering a seamless …

Thumbnail

The Thumbnail pattern displays static image previews in a simple layout, allowing …

Breadcrumbs

Breadcrumbs are a form of secondary navigation that display a series of …

Page Title

The Page Title pattern offers users a comprehensive and intuitive navigation experience …

Pagination

A pagination pattern showing the number of visible rows per page with …

Scrollbar

The Scrollbar component helps users navigate scrollable content by indicating their position …

Section Navigation

Under Maintenance …

Side Bar

The Sidebar is the side section containing navigation menus between applications or …

Top Bar

The Top Bar is a top-anchored component that provides context for the …

Tree View

A Tree View is a hierarchical structure that visually represents the relationship …

Banner

Highlighted notifications, displayed at the top of the interface, occupying the entire …

Inline Message

Messages placed at the top of a page or section to inform …

Notification Panel

This pattern allows users to access and read all notifications in one …

Toast

Quick, small notifications that appear in the top right corner of the …

Dialog

Dialogs are a type of modal used to convey information, often requiring …

Flyout

Flyout is used to show additional information about the page content, make …

Modal

Modals are overlay windows that focus user attention on essential tasks, enhancing …

Progress Bar

Progress Bars provide users with real-time feedback on the status of ongoing …

Progress Circle

A Progress Circle is a graphical representation that provides feedback about the …

Stepper

The Stepper component presents a sequence of milestones that outline a complex …

Avatar

An Avatar is a visual representation of a user, entity or object …

Error Page

An error page is a web page displayed by a browser when …

Launch Screen

Under maintenance …

Login

Under Maintenance …

Calendar

Under maintenance …

Actions

Data Visualization

Filters

Forms

Foundations

Indicators

Inputs

Media

Navigation

Notifications

Overlays

Progress

Social

Template

Widgets

Outline