Home

Comparing Design System Components

Use this resource to find resources and code for a variety of components to help write your own.

Each component has its own section.

For each section, there is table with the design system name, the type (ie link to code, guide, playground etc) and the link.

Table of Contents

Button

Design SystemTypeLink
Carbonsourcehttps://github.com/carbon-design-system/carbon-components-react/tree/master/src/components/Button
Carbonexamplehttps://www.carbondesignsystem.com/components/button/code/
AtlasKitexamplehttps://atlaskit.atlassian.com/packages/core/button
AtlasKitsourcehttps://bitbucket.org/atlassian/atlaskit-mk-2/src/master/packages/core/button

AtlasKit button uses the following method to determine the element tag:

getElement = () => { const { href, isDisabled } = this.props; if (href) { return isDisabled ? 'span' : 'a'; } return 'button'; };

Repository

https://github.com/okeeffed/developer-notes-nextjs/content/design-systems/comparing-design-systems

Sections


Related