Skip to main content

UI Component Libraries

Some reasons to go explore these:

While developing

  • Defining naming conventions or figuring out what to name your component and/or component api (prop options)
  • Figuring out what are common use cases the component may need to be extended for?
  • How do others scale this type of component?

In General

  • What do you like about their storybooks?
  • What do you not like?

UI Component Libraries List

Audi

Workday Canvas Kit

  • GREAT API & Pattern Guidelines documentation, not necessarily supporting exact choices (not looking that in depth) but the style of documentation and the topics covered
  • Good example of Component status documentation
  • Good to have contribution guidelines
  • Good grouping in nav

Gitlab

  • Good breakdown of navigation categories, not one big list

Shopify

  • Notice navigation is one big list and not as easy to navigate.

Backpack UI

  • Notice how Styles->Icons are hard to view them all at once. If thinking about the UX this could have been organized better.

IBM

  • Tho it is not a storybook it is a good resource for how they categorize, document and in general handle things

USWDS Components

  • Again not a storybook but GREAT resource for generic ui components

WIX

  • Notice how the colors and icons are done. Icon allows for search which is nice

Chakra UI

  • Bad nav
  • Good multi example views vs breaking them all up individually

Grommet

  • Good Nav grouping

Reaviz

  • Good charts examples

Lucid

  • Like how some nav goes straight to docs view vs canvas view
  • Bad not good UX for documentation (TLDR) and too small and it keeps scrolling me to the bottom

AnyVision

  • Good example of tooltip variants (overflow)

Backpack

  • Really bad nav

Grafana

  • Good nav categories
  • Good multi examples per canvas
  • Icons too small to see easily
  • Would also prefer bigger theme color swatches and not so many colors....

Power Xpert Blue

  • Limited but still good examples

Salesforce

  • Bad nav