March 10, 2025

Ant Design System for Figma 5.24

New version based on Ant Design v 5.24 is now available! We also added Ant Design X components to the UI kit!

New Features

  • 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

How to get the new updates?

After each update you will get an e-mail with the updated files. You can also get the new files via your LemonSqueezy account and through your email with the receipt.

Learn how
Get Ant Design System for Figma today

Speed up your design and development process

Stop wasting time on creating everything from scratch for every new project you start. Use pixel-perfect and handcrafted elements to design and implement your next Ant Design app efficiently.