logoAnt Design

⌘ K
  • Design
  • Development
  • Components
  • Blog
  • Resources
5.3.3
  • Ant Design
    • Introduction
    • Design Values
    • Cases
  • Global Styles
    • Colors
    • Layout
    • Font
    • Icons
    • Dark Mode
    • Shadow
  • Design Patterns
    • Overview
    • Global Rules
      • Feedback
      • Navigation
      • Data Entry
      • Data Display
      • Copywriting
      • Data format
      • Button
      • Data List
    • Template Document
      • Form Page
      • Visualization Page
      • Detail Page
    • Principles
      • Proximity
      • Alignment
      • Contrast
      • Repetition
      • Make it Direct
      • Stay on the Page
      • Keep it Lightweight
      • Provide an Invitation
      • Use Transition
      • React Immediately
  • Design Patterns (Research)
    • Overview
    • Template Document
      • Form Page
      • Workbench
      • List Page
      • Result Page
      • Exception Page
    • Global Rules
      • Navigation
      • Message and Feedback
      • Empty Status
  • Visualization
  • Motion
  • Illustrations
Guidelines and Resources
Front-end Implementation
Who's using Ant Design
Words From Community
How to Contribute

Introduction

Design Values

Resources

Ant Design Charts
Ant Design Pro
Ant Design Pro Components
Ant Design Mobile
Ant Design Mini
Ant Design Landing-Landing Templates
Scaffolds-Scaffold Market
Umi-React Application Framework
dumi-Component doc generator
qiankun-Micro-Frontends Framework
ahooks-React Hooks Library
Ant Motion-Motion Solution
China Mirror 🇨🇳

Community

Awesome Ant Design
Medium
Twitter
yuqueAnt Design in YuQue
Ant Design in Zhihu
Experience Cloud Blog
seeconfSEE Conf-Experience Tech Conference

Help

GitHub
Change Log
FAQ
Bug Report
Issues
Discussions
StackOverflow
SegmentFault

Ant XTechMore Products

yuqueYuQue-Document Collaboration Platform
AntVAntV-Data Visualization
EggEgg-Enterprise Node.js Framework
kitchenKitchen-Sketch Toolkit
xtechAnt Financial Experience Tech
Theme Editor
Made with ❤ by
Ant Group and Ant Design Community

Ant Financial has a large number of enterprise-level products. With complex scenarios, designers and developers often need to respond fast due to frequent changes in product demands and concurrent R & D workflow. Many similar contents exist in the process. Through abstraction, we could obtain some stable and highly reusable components and pages.

On the other hand, with the trend of commercialization, more and more enterprise products begin to pursue better user experiences. Under this situation, Ant User-Experience Design Team builds a design system for enterprise products based on four design values of Natural, Certain, Meaningful, and Growing. It aims to uniform the user interface specs and reduce redundancies and excessive production costs, helping product designers to focus on better user experience.


Guidelines and Resources

We provide comprehensive design guidelines, best practices, resources, and tools to help designers produce high-quality product prototypes.

  • Design values
  • Design patterns
  • Visualization
  • Illustrations
  • Design resources
  • Sketch toolbox
  • Articles

Front-end Implementation

React is used to encapsulate a library of components which embody our design language. We welcome the community to implement our design system in other front-end frameworks of their choice.

  • Ant Design of React(official implementation)
  • NG-ZORRO - Ant Design of Angular
  • NG-ZORRO-MOBILE - Ant Design Mobile of Angular
  • Ant Design of Vue
  • Ant Design Blazor
  • San UI Toolkit for Ant Design
  • antizer (ClojureScript)

Who's using Ant Design

  • Ant Financial
  • Alibaba
  • Tencent
  • Baidu
  • Koubei
  • Meituan
  • Didi
  • Eleme
  • Other Users

If your company or products use Ant Design, and you'd like to be added to this growing list, click here to leave us a message.

Words From Community

  • Hacknews: Show HN: Antd – A set of high-quality React components
  • Alligator: Crafting Beautiful UIs in React Using Ant Design
  • Introduction to Ant Design
  • Build a React App with Ant Design Principles
  • Meet Antd, an enterprise React UI library

How to Contribute

Contributions to Ant Design on GitHub are welcomed! Whether you have questions, concerns, or suggestions for improving Ant Design - please don't hesitate to reach out to us here.