Ant Design System for Figma 5.24

New Features

• Added Ant Design X Components with screen examples based on Ant Design X

• Enhanced Color System

  • Added full color palette support to Button component
  • Introduced pink color to variables for Button color palette
  • Added nodeHoverColor and nodeSelectedColor variables to Tree component

• New Component Variants

  • Added Round variant to Segmented component
  • Introduced Underlined variant to Input, InputNumber, Select, DatePicker, and TimePicker
  • Added Borderless variant to Select component
  • Added Filled variant to Select and TimePicker components
  • Added preset variant to DatePicker component
  • Added showWeek variant to Calendar component

• Component Property Additions

  • Added prefix to DatePicker Input (Outlined) with swap property
  • Added prefix to Select component with swap property
  • Introduced Max Count feature to Select component with swap property
  • Added separator to Input/OTP components
  • Added Icon property to Notification component
  • Added indentSize variable for custom indent width in Tree component

Improvements

• Visual Consistency Updates
  • Card component now uses bodyPaddingSM, headerPaddingSM, bodyPadding, and headerPadding tokens
  • Menu now utilizes subMenuItemSelectedColor token for submenu titles with selected options
  • Added optionSelectedColor to Cascader for selected options
  • Changed arrow color in Select from colorTextPlaceholder to colorTextQuaternary
  • Added activeBorderColor and hoverBorderColor variables to Select component
  • Introduced labelColor token in Description component, replacing colorTextTertiary
• Organization & Usability
  • Improved page organization with new playground and grouped component sections
  • Added AntblocksUI to a single page for better component organization
  • Removed underscores from component names to enhance searchability

Bug Fixes

• Fixed hover state color in DatePicker Filled component (colorFillTertiary → colorFillSecondary)
• Fixed text color in Filled variant for Input and DatePicker (colorFillDescription → colorTextPlaceholder)
• Fixed color issues for warning and error statuses in DatePicker and TimePicker
• Fixed icon color in TimePicker Input components
• Changed icon in TimePicker (Borderless) to ClockCircleOutlined
• Fixed DatePicker color in disabled state to colorBgContainerDisabled