-
AccordionAccordions provide a way to hide or expand large sections of content.
-
BreadcrumbBreadcrumbs show the path from the homepage to the current page.
-
ButtonA button lets users take a specific action or complete a task.
-
CardA card provides information about linked resources in a structured format. Cards always appear as part of a group.
-
CheckboxA checkbox lets users select one or more options from a list.
-
Drop-down selectThe drop-down select component allows users to choose one item from a drop-down list.
-
FooterThe footer appears at the bottom of every page. It provides consistency and gives users access to important links.
-
Global alertA global alert appears at the top of every page across a website or app.
-
Icon objectThe icon object is a standalone icon with a circular background.
-
HeaderThe header provides consistent navigation across every page of a web app or site.
-
In-page alertIn-page alerts help the user in the context of a single webpage.
-
LinkA link takes users to another page, to a different part of the same page, or to view a document.
-
List groupThe list group offers a visually stacked list of links, including titles and link icons.
-
Radio buttonA radio button let users choose one option from a list of two or more choices.
-
TagTags are small elements that help label, organize, categorize, or filter content using keywords.
-
TableTables display data in a structured grid. They’re made up of rows and columns.
-
Text inputThe text input component provides a field for users to enter short text responses.
Keystone Design System
Components
Learn when and how to use the components that make up the Keystone Design System.