Leaf UI
  • English

      • Components

      Browse components, examples and API references.

      General

      Button

      Trigger actions such as saving or submitting.

      Divider

      Separate content, paragraphs or actions.

      Navigation

      Steps

      Follow task steps and progress.

      Breadcrumb

      Show the page hierarchy.

      Pagination

      Browse data by page.

      Tabs

      Switch between content views.

      Data display

      Tag

      Label categories or statuses.

      Badge

      Show counts and notifications.

      Avatar

      Display a user, team or object avatar.

      Card

      Group related content and actions in a container.

      Empty

      Explain empty content and provide a next action.

      Collapse

      Expand or collapse a group of sections.

      Data entry

      Input

      Enter a single line of text.

      InputNumber

      Enter quantities, prices and numbers.

      Textarea

      Enter multiple lines of text.

      Checkbox

      Select one or more options.

      Radio

      Choose one option from a group.

      Switch

      Turn a setting on or off.

      Select

      Choose an option from a list.

      AutoComplete

      Complete input with suggestions.

      Cascader

      Choose a hierarchical value.

      Form

      Organize fields and validation.

      Slider

      Choose a number or range by sliding.

      Rate

      Select or display a rating.

      Date and time

      DatePicker

      Choose a date from a calendar.

      TimePicker

      Choose hours, minutes and seconds.

      DateTimePicker

      Choose a specific date and time.

      DateRangePicker

      Choose a date or time range.

      Calendar

      Browse dates and schedules.

      Feedback

      Dropdown

      Group actions in a menu.

      Modal

      View or edit inside a dialog.

      Drawer

      Open content from a page edge.

      Confirm

      Confirm important actions.

      Alert

      Display information that needs attention.

      Message

      Show brief operation feedback.

      Loading

      Indicate loading content.

      Progress

      Display task completion.

      Tooltip

      Add brief explanations.

      Skeleton

      Show a content placeholder while loading.

      Popover

      Show details or actions next to an element.

      Configuration

      ConfigProvider

      Set regional themes and languages.