-
Accordion: Divide content into collapsible sections
-
ActionIcon: Icon button
-
Affix: Renders children inside portal at fixed position
-
Alert: Attract user attention with important static message
-
Anchor: Display link with theme styles
-
AngleSlider: Pick angle value between 0 and 360
-
AppShell: Responsive shell for your application with header, navbar, aside and footer
-
AspectRatio: Maintain responsive consistent width/height ratio
-
Autocomplete: Autocomplete user input with any list of options
-
Avatar: Display user profile image, initials or fallback icon
-
BackgroundImage: Displays image as background
-
Badge: Display badge, pill or tag
-
Blockquote: Blockquote with optional cite
-
Box: Base component for all Mantine components
-
Breadcrumbs: Separates list of react nodes with given separator
-
Burger: Open/close navigation button
-
Button: Button component to render button or link
-
Card: Card with sections
-
Center: Centers content vertically and horizontally
-
Checkbox: Capture boolean input from user
-
Chip: Pick one or multiple values with inline controls
-
CloseButton: Button with close icon
-
Code: Inline and block code
-
Collapse: Animate presence with slide down/up transition
-
ColorInput: Capture color from user
-
ColorPicker: Pick colors in hex(a), rgb(a), hsl(a) and hsv(a) formats
-
ColorSwatch: Displays color
-
Combobox: Create custom select, autocomplete or multiselect inputs
-
Container: Center content with padding and max-width
-
CopyButton: Copies given text to clipboard
-
CorePackage
-
Dialog: Display a fixed overlay dialog at any side of the screen
-
Divider: Horizontal line with optional label or vertical divider
-
Drawer: Display overlay area at any side of the screen
-
Fieldset: Group related elements in a form
-
FileButton: Open file picker with a button click
-
FileInput: Capture files from user
-
Flex: Compose elements in a flex container
-
FloatingIndicator: Display a floating indicator over a group of elements
-
FocusTrap: Trap focus at child node
-
Grid: Responsive 12 columns grid system
-
Group: Compose elements and components in a horizontal flex container
-
Highlight: Highlight given part of a string with mark
-
HoverCard: Display popover section when target element is hovered
-
Image: Image with optional fallback
-
Indicator: Display element at the corner of another element
-
Input: Base component to create custom inputs
-
JsonInput: Capture json data from user
-
Kbd: Display keyboard key
-
List: Display ordered or unordered list
-
Loader: Indicate loading state
-
LoadingOverlay: An overlay with centered loader
-
Mark: Highlight part of the text
-
Menu: Combine a list of secondary actions into single interactive area
-
Modal: An accessible overlay dialog
-
MultiSelect: Custom searchable multi select
-
NativeSelect: Native select element based on Input
-
NavLink: Navigation link
-
Notification: Show dynamic notifications and alerts to user, part of notifications system
-
NumberFormatter: Format number with thousands/decimal separators and suffix/prefix
-
NumberInput: Capture number from user
-
Overlay: Overlays parent element with div element with any color and opacity
-
Pagination: Display active page and navigate between multiple pages
-
Paper: Renders white or dark background depending on color scheme
-
PasswordInput: Capture password data from user
-
Pill: Removable and non-removable tags
-
PillsInput: Base component for custom tags inputs and multi selects
-
PinInput: Capture pin code or one time password from the user
-
Popover: Display popover section relative to given target element
-
Portal: Renders component outside of parent element tree
-
Progress: Give user feedback for status of the task
-
Radio: Wrapper for input type radio
-
RangeSlider: RangeSlider component
-
Rating: Pick and display rating
-
RingProgress: Give user feedback for status of the task with circle diagram
-
ScrollArea: Area with custom scrollbars
-
SegmentedControl: A linear set of two or more segments
-
Select: Custom searchable select
-
SemiCircleProgress: Represent progress with semi circle diagram
-
SimpleGrid: Responsive grid in which each item takes equal amount of space
-
Skeleton: Indicate content loading state
-
Slider: Slider component
-
Space: Add horizontal or vertical spacing from theme
-
Spoiler: Hide long sections of content under a spoiler
-
Stack: Compose elements and components in a vertical flex container
-
Stepper: Display content divided into a steps sequence
-
Switch: Capture boolean input from user
-
Table: Render table with theme styles
-
TableOfContents: Renders a list of headings on the page and tracks current heading visible in the viewport
-
Tabs: Switch between different views
-
TagsInput: Capture a list of values from user with free input and suggestions
-
Text: Display text
-
Textarea: Autosize or regular textarea
-
TextInput: Capture string input from user
-
ThemeIcon: Render icon inside element with theme colors
-
Timeline: Display list of events in chronological order
-
Title: h1-h6 heading
-
Tooltip: Renders tooltip at given element on mouse over or other event
-
Transition: Animate presence of component with pre-made animations
-
Tree: Display a Tree structure
-
Typography: Styles provider for html content
-
UnstyledButton: Unstyled polymorphic button
-
VisuallyHidden: Hide element visually but keep it accessible for screen readers
Reference these resources when working with Mantine UI - LLM Documentation.