Need advice about which tool to choose?Ask the StackShare community!

Ant Design

739
1.2K
+ 1
203
Emotion

179
182
+ 1
2
Add tool

Ant Design vs Emotion: What are the differences?

Ant Design: A set of high-quality React components. An enterprise-class UI design language and React-based implementation. Graceful UI components out of the box, base on React Component. A npm + webpack + babel + dora + dva development framework; Emotion: The Next Generation of CSS in JS. Emotion is a performant and flexible CSS-in-JS library. Building on many other CSS-in-JS libraries, it allows you to style apps quickly with string or object styles. It has predictable composition to avoid specificity issues with CSS. With source maps and labels, Emotion has a great developer experience and great performance with heavy caching in production.

Ant Design and Emotion can be categorized as "JavaScript Framework Components" tools.

Ant Design and Emotion are both open source tools. It seems that Ant Design with 48.5K GitHub stars and 17.1K forks on GitHub has more adoption than Emotion with 8.39K GitHub stars and 524 GitHub forks.

Telepath, XPrep, and Arhia are some of the popular companies that use Ant Design, whereas Emotion is used by CircleCI, MakeSpace Labs, Inc, and Park Holidays UK. Ant Design has a broader approval, being mentioned in 24 company stacks & 33 developers stacks; compared to Emotion, which is listed in 11 company stacks and 5 developer stacks.

Advice on Ant Design and Emotion
Needs advice
on
Next.js
Material-UI
and
Ant Design

Hi, I start building an admin dashboard with next.js and looking for a frontend framework ( components ready ). So I end up with Ant Design and Material-UI, but I never built a project with these two.

Here is a list of my requirements.

  1. Good documentation.
  2. easy CRUD ( date picker and date range picker bundled )
  3. built-in multi-lang feature or Great 3rd library support
  4. Admin dashboard template
  5. well code maintenance

Which is better for the long run?

See more
Replies (2)
Irving Caamal
Full Stack Developer at Freelance · | 2 upvotes · 34K views
Recommends

https://github.com/uber/baseweb I highly recommend you baseweb, it's easy and very customizable and also beautiful.

See more
Recommends

I'm using both of them. But If you want to create admin dashboard, You should try AntDesign. They (Alibaba / Taobao) created a group of UI libaries to create admin dashboard. It's production ready. https://procomponents.ant.design/en-US/components/table https://pro.ant.design/docs/layout In my opinion, If you want to create a dashboard with mobile first / simple dashboard, you can choice material ui. otherwise, antdesign is better (if you want focus on desktop /tablet ui). Some of skeleton has built with material ui such as react-admin is good point to start. But if you want to create admin site with antdesign, I think you should build with umijs (it is alternative and compatible with nextjs and antd support directlly)

See more
Get Advice from developers at your company using Private StackShare. Sign up for Private StackShare.
Learn More
Pros of Ant Design
Pros of Emotion
  • 38
    Lots of components
  • 29
    Polished and enterprisey look and feel
  • 20
    TypeScript
  • 18
    Es6 support
  • 18
    Easy to integrate
  • 16
    Beautiful and solid
  • 15
    Beautifully Animated Components
  • 14
    Quick Release rhythm
  • 13
    Great documentation
  • 12
    Typescript support
  • 10
    Short Code
  • 2
    Easy to use

Sign up to add or upvote prosMake informed product decisions

Cons of Ant Design
Cons of Emotion
  • 16
    Less
  • 8
    Large File Size
  • 7
    Close
  • 3
    Poor accessibility support
  • 1
    Sdf
  • 1
    Ddd
  • 1
    Zxv
  • 1
    Gago
    Be the first to leave a con

    Sign up to add or upvote consMake informed product decisions

    What is Ant Design?

    An enterprise-class UI design language and React-based implementation. Graceful UI components out of the box, base on React Component. A npm + webpack + babel + dora + dva development framework.

    What is Emotion?

    Emotion is a performant and flexible CSS-in-JS library. Building on many other CSS-in-JS libraries, it allows you to style apps quickly with string or object styles. It has predictable composition to avoid specificity issues with CSS. With source maps and labels, Emotion has a great developer experience and great performance with heavy caching in production.

    Need advice about which tool to choose?Ask the StackShare community!

    What companies use Ant Design?
    What companies use Emotion?
    See which teams inside your own company are using Ant Design or Emotion.
    Sign up for Private StackShareLearn More

    Sign up to get full access to all the companiesMake informed product decisions

    What tools integrate with Ant Design?
    What tools integrate with Emotion?

    Sign up to get full access to all the tool integrationsMake informed product decisions

    What are some alternatives to Ant Design and Emotion?
    Material-UI
    MUI (formerly Material-UI) is the React UI library you always wanted. Follow your own design system, or start with Material Design.
    Bootstrap
    Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.
    Semantic UI
    Semantic empowers designers and developers by creating a shared vocabulary for UI.
    Semantic UI React
    Semantic UI React is the official React integration for Semantic UI. jQuery Free, Declarative API, Shorthand Props, and more.
    Blueprint
    Blueprint is a React UI toolkit for the web. It is optimized for building complex, data-dense web interfaces for desktop applications. If you rely heavily on mobile interactions and are looking for a mobile-first UI toolkit, this may not be for you.
    See all alternatives