Start sharing components as a team!Share components as a team!Join Bit to build your applications faster.Get Started Free

Explore thousands of open source components to build your apps

Discover reusable components with minimal dependencies shared by developers around the world. Choose and use components to build your applications.
THE BEST OF

REACT CHARTS

Displaying analytics in a visual way can be done with charts of all types. The best open source React charts are now available as components.
recharts /
line-chart
v1.6.2
Line chart React component
Build: Pass
public
mit
120 KB
recharts /
composed-chart
v1.6.2
Composed chart React component is used to combine multiple c...
Build: Pass
public
mit
125 KB
grommet /
chart
v2.11.1
A graphical chart.
Build: Pass
public
apache
28 KB
recharts /
area-chart
v1.6.2
Area chart React component
Build: Pass
public
mit
120 KB
recharts /
bar-chart
v1.6.2
Bar chart React component
Build: Pass
public
mit
120 KB
react-rainbow /
chart
v1.10.0
The Chart components are based on Charts.js an open source H...
Build: Pass
public
137 KB
recharts /
scatter-chart
v1.6.2
Scatter chart React component
Build: Pass
public
mit
120 KB
recharts /
pie-chart
v1.6.2
Pie chart React component
Build: Pass
public
mit
122 KB
primereact /
organizationchart
v4.2.0
OrganizationChart visualized hierarchical organization data.
Build: Pass
public
mit
6 KB
recharts /
radar-chart
v1.6.2
Radar chart React component
Build: Pass
public
mit
120 KB
recharts /
radial-bar-chart
v1.6.2
Radial bar chart React component
Build: Pass
public
mit
121 KB
chevron_leftLeft
More Examples
Rightchevron_right
grommet /
chart
v2.11.1
A graphical chart.
Build: Pass
public
apache
28 KB
recharts /
area-chart
v1.6.2
Area chart React component
Build: Pass
public
mit
120 KB
recharts /
line-chart
v1.6.2
Line chart React component
Build: Pass
public
mit
120 KB
recharts /
composed-chart
v1.6.2
Composed chart React component is used to combine multiple c...
Build: Pass
public
mit
125 KB

React Buttons

Buttons are the most popular UI components in Bit's community. Find the best buttons to help users take actions in your React applications.
semantic-ui-react /
button
v0.88.2
A Button indicates a possible user action
Build: Pass
public
mit
84 KB
react-rainbow /
button-icon
v1.10.0
Buttons Icons provide the user with visual iconography that ...
Build: Pass
public
20 KB
react-rainbow /
button-menu
v1.10.0
A Button Menu offers a list of actions or functions that a u...
Build: Pass
public
24 KB
react-bootstrap /
button-group
v1.0.0
Sets the size for all Buttons in the group.
Build: Pass
public
mit
4 KB
material-ui /
button
v4.9.10
Buttons allow users to take actions, and make choices, with ...
Build: Pass
public
mit
32 KB
react-bootstrap /
button
v1.0.0
One or more button variant combinations
Build: Pass
public
mit
5 KB
react-rainbow /
button-group
v1.10.0
Button groups are used to bunch together buttons with simila...
Build: Pass
public
18 KB
semantic-ui-react /
confirm
v0.88.2
Called when the Modal is closed without clicking confirm.
Build: Pass
public
mit
88 KB
react-rainbow /
button
v1.10.0
Buttons are clickable items used to perform an action.
Build: Pass
public
22 KB
primereact /
button
v4.2.0
Button is an extension to standard input element with icons ...
Build: Pass
public
mit
9 KB
react-rainbow /
radio-button-group
v1.10.0
A button list that can have a single entry checked at any on...
Build: Pass
public
22 KB
le
shared-ui /
toggle-button
v0.0.3
Renders an icon and a text into an `PrimaryButton`.
Build: Pass
public
mit
8 KB
primereact /
splitbutton
v4.2.0
SplitButton groups a set of commands in an overlay with a de...
Build: Pass
public
mit
48 KB
Build: Pass
public
mit
34 KB
material-ui /
icon-button
v4.9.10
If given, uses a negative margin to counteract the padding o...
Build: Pass
public
mit
32 KB
Build: Pass
public
mit
4 KB
Build: Pass
public
mit
31 KB
Build: Pass
public
mit
4 KB
Build: Pass
public
apache
32 KB
sa
ui-components /
store
v1.0.10
Beautified button for AppStore/PlayMarket redirecting
Build: Pass
public
mit
21 KB
chevron_leftLeft
More Examples
Rightchevron_right
semantic-ui-react /
button
v0.88.2
A Button indicates a possible user action
Build: Pass
public
mit
84 KB
react-rainbow /
button-icon
v1.10.0
Buttons Icons provide the user with visual iconography that ...
Build: Pass
public
20 KB
react-rainbow /
button-menu
v1.10.0
A Button Menu offers a list of actions or functions that a u...
Build: Pass
public
24 KB
react-bootstrap /
button-group
v1.0.0
Sets the size for all Buttons in the group.
Build: Pass
public
mit
4 KB
material-ui /
button
v4.9.10
Buttons allow users to take actions, and make choices, with ...
Build: Pass
public
mit
32 KB
react-bootstrap /
button
v1.0.0
One or more button variant combinations
Build: Pass
public
mit
5 KB

React Tables

Tables are the most comfortable way to display data. Now it's easier than ever with tables as React components.
grommet /
data-table
v2.11.1
A data driven table.
Build: Pass
public
apache
52 KB
react-bootstrap /
table
v1.0.0
Adds zebra-striping to any table row within the `<tbody>`.
Build: Pass
public
mit
3 KB
semantic-ui-react /
table
v0.88.2
A table can use fixed a special faster form of table renderi...
Build: Pass
public
mit
75 KB
material-ui /
table
v4.9.10
Data tables display information in a way that’s easy to scan...
Build: Pass
public
mit
24 KB
Build: Pass
public
mit
4 KB
le
shared-ui /
list-builder
v0.0.3
Renders a responsive table into a parent container;
Build: Pass
public
mit
6 KB
grommet /
table
v2.11.1
A table of data organized in cells.
Build: Pass
public
apache
26 KB
material-ui /
table-pagination
v4.9.10
A `TableCell` based component for placing inside `TableFoote...
Build: Pass
public
mit
56 KB
primereact /
treetable
v4.2.0
TreeTable is used to display hierarchical data in tabular fo...
Build: Pass
public
mit
68 KB
material-ui /
table-head
v4.9.10
Demos: - [Tables](https://material-ui.com/components/tables...
Build: Pass
public
mit
24 KB
material-ui /
table-cell
v4.9.10
`<TableCell>` will be rendered as an `<th>`or `<td>` dependi...
Build: Pass
public
mit
25 KB
material-ui /
table-body
v4.9.10
Demos: - [Tables](https://material-ui.com/components/tables...
Build: Pass
public
mit
24 KB
Build: Pass
public
mit
31 KB
react-rainbow /
table
v1.10.0
Data tables display information in a way that’s easy to scan...
Build: Pass
public
51 KB
primereact /
datatable
v4.2.0
DataTable displays data in tabular format.
Build: Pass
public
mit
73 KB
Build: Pass
public
mit
24 KB
chevron_leftLeft
More Examples
Rightchevron_right

React Navigations

React navigation bars, breadcrumbs, paginations and tabs components to help users successfully navigate through your application and items.
semantic-ui-react /
tab
v0.88.2
Called on tab change.
Build: Pass
public
mit
78 KB
react-bootstrap /
navbar
v1.0.0
The general visual variant a the Navbar. Use in combination ...
Build: Pass
public
mit
11 KB
material-ui /
tabs
v4.9.10
Tabs make it easy to explore and switch between different vi...
Build: Pass
public
mit
36 KB
material-ui /
breadcrumbs
v4.9.10
Demos: - [Breadcrumbs](https://material-ui.com/components/b...
Build: Pass
public
mit
34 KB
semantic-ui-react /
sidebar
v0.88.2
Called before a sidebar begins to animate out.
Build: Pass
public
mit
75 KB
semantic-ui-react /
pagination
v0.88.2
Called on change of an active page.
Build: Pass
public
mit
78 KB
react-bootstrap /
tabs
v1.0.0
Mark the Tab with a matching `eventKey` as active.
Build: Pass
public
mit
13 KB
semantic-ui-react /
breadcrumb
v0.88.2
A breadcrumb is used to show hierarchy between content.
Build: Pass
public
mit
74 KB
react-bootstrap /
nav
v1.0.0
The visual variant of the nav items.
Build: Pass
public
mit
8 KB
react-bootstrap /
breadcrumb
v1.0.0
ARIA label for the nav element https://www.w3.org/TR/wai-ari...
Build: Pass
public
mit
5 KB
sa
ui-components /
tabbar
v1.0.4
Styled tabs component
Build: Pass
public
mit
21 KB
material-ui /
table-pagination
v4.9.10
A `TableCell` based component for placing inside `TableFoote...
Build: Pass
public
mit
56 KB
react-foundation /
pagination
v0.9.6
Pagination is a type of navigation that lets users click thr...
Build: Pass
public
mit
39 KB
Build: Pass
public
mit
19 KB
react-foundation /
tabs
v0.9.6
Tabs are elements that help you organize and navigate multip...
Build: Pass
public
mit
39 KB
grommet /
skip-links
v2.11.1
Describe a list of elements to skip to.
Build: Pass
public
apache
N/A
material-ui /
bottom-navigation
v4.9.10
Bottom navigation bars display three to five destinations at...
Build: Pass
public
mit
24 KB
grommet /
carousel
v2.11.1
A carousel that cycles through children. Child components
Build: Pass
public
apache
34 KB
Build: Pass
public
mit
9 KB
chevron_leftLeft
More Examples
Rightchevron_right
semantic-ui-react /
tab
v0.88.2
Called on tab change.
Build: Pass
public
mit
78 KB
react-bootstrap /
navbar
v1.0.0
The general visual variant a the Navbar. Use in combination ...
Build: Pass
public
mit
11 KB
material-ui /
tabs
v4.9.10
Tabs make it easy to explore and switch between different vi...
Build: Pass
public
mit
36 KB
material-ui /
breadcrumbs
v4.9.10
Demos: - [Breadcrumbs](https://material-ui.com/components/b...
Build: Pass
public
mit
34 KB
semantic-ui-react /
sidebar
v0.88.2
Called before a sidebar begins to animate out.
Build: Pass
public
mit
75 KB
semantic-ui-react /
pagination
v0.88.2
Called on change of an active page.
Build: Pass
public
mit
78 KB

React Cards

Card components to display subjects such as items, profiles and categories. Help users choose and take action in your React application.
material-ui /
card
v4.9.10
Cards contain content and actions about a single subject.
Build: Pass
public
mit
24 KB
react-bootstrap /
card
v1.0.0
Sets card background
Build: Pass
public
mit
5 KB
Build: Pass
public
mit
31 KB
material-ui /
card-actions
v4.9.10
If `true`, the actions do not have additional margin.
Build: Pass
public
mit
24 KB
material-ui /
card
v4.9.10
Cards contain content and actions about a single subject.
Build: Pass
public
mit
24 KB
react-bootstrap /
card
v1.0.0
Sets card background
Build: Pass
public
mit
5 KB
Build: Pass
public
mit
31 KB
material-ui /
card-actions
v4.9.10
If `true`, the actions do not have additional margin.
Build: Pass
public
mit
24 KB
wired-elements /
wired-card
v1.0.0
wired-card is s a container for other web elements - with a ...
Build: Pass
public
mit
11 KB
material-ui /
card-content
v4.9.10
Demos: - [Cards](https://material-ui.com/components/cards/)...
Build: Pass
public
mit
24 KB
react-rainbow /
card
v1.10.0
Cards are used to apply a container around a related groupin...
Build: Pass
public
21 KB
Build: Pass
public
mit
4 KB
primereact /
card
v4.2.0
Card is a flexible container component.
Build: Pass
public
mit
5 KB
material-ui /
card-media
v4.9.10
Demos: - [Cards](https://material-ui.com/components/cards/)...
Build: Pass
public
mit
24 KB
material-ui /
card-header
v4.9.10
Demos: - [Cards](https://material-ui.com/components/cards/)...
Build: Pass
public
mit
25 KB
chevron_leftLeft
More Examples
Rightchevron_right
Card components to display subjects such as items, profiles and categories. Help users choose and take action in your React application.
See More React Cards
React Menus
Every React app needs header, dropdown and tab menus to help users navigate. Choose the menu you need from popular open source components.
react-rainbow /
button-menu
v1.10.0
A Button Menu offers a list of actions or functions that a u...
Build: Pass
public
24 KB
react-rainbow /
select
v1.10.0
Select element presents a menu of options.
Build: Pass
public
21 KB
react-foundation /
menu
v0.9.6
Our flexible menu component makes it easy to build many comm...
Build: Pass
public
mit
39 KB
react-bootstrap /
dropdown
v1.0.0
Determines the direction and location of the Menu in relatio...
Build: Pass
public
mit
20 KB
material-ui /
menu
v4.9.10
Menus display a list of choices on temporary surfaces.
Build: Pass
public
mit
37 KB
semantic-ui-react /
menu
v0.88.2
onClick handler for MenuItem.
Build: Pass
public
mit
75 KB
material-ui /
select
v4.9.10
Select components are used for collecting user provided info...
Build: Pass
public
mit
47 KB
primereact /
megamenu
v4.2.0
MegaMenu is navigation component that displays submenus toge...
Build: Pass
public
mit
8 KB
primereact /
tabmenu
v4.2.0
Menu is a navigation/command component that displays items a...
Build: Pass
public
mit
5 KB
primereact /
tieredmenu
v4.2.0
TieredMenu displays submenus in nested overlays.
Build: Pass
public
mit
47 KB
primereact /
panelmenu
v4.2.0
PanelMenu is a hybrid of accordion-tree components.
Build: Pass
public
mit
9 KB
primereact /
menubar
v4.2.0
Menubar is a horizontal menu component.
Build: Pass
public
mit
8 KB
grommet /
menu
v2.11.1
A control that opens a Drop containing plain Buttons.
Build: Pass
public
apache
43 KB
primereact /
menu
v4.2.0
Menu is a navigation/command component that supports dynamic...
Build: Pass
public
mit
45 KB
material-ui /
menu-item
v4.9.10
`classes` prop applied to the [`ListItem`](/api/list-item/) ...
Build: Pass
public
mit
33 KB
material-ui /
menu-list
v4.9.10
If `true`, will focus the `[role="menu"]` container and move...
Build: Pass
public
mit
25 KB
primereact /
contextmenu
v4.2.0
ContextMenu displays an overlay menu on right click of its t...
Build: Pass
public
mit
46 KB
primereact /
slidemenu
v4.2.0
SlideMenu displays submenus with a slide animation.
Build: Pass
public
mit
46 KB
chevron_leftLeft
More Examples
Rightchevron_right
react-rainbow /
button-menu
v1.10.0
A Button Menu offers a list of actions or functions that a u...
Build: Pass
public
24 KB
react-rainbow /
select
v1.10.0
Select element presents a menu of options.
Build: Pass
public
21 KB
react-foundation /
menu
v0.9.6
Our flexible menu component makes it easy to build many comm...
Build: Pass
public
mit
39 KB
react-bootstrap /
dropdown
v1.0.0
Determines the direction and location of the Menu in relatio...
Build: Pass
public
mit
20 KB
material-ui /
menu
v4.9.10
Menus display a list of choices on temporary surfaces.
Build: Pass
public
mit
37 KB
semantic-ui-react /
menu
v0.88.2
onClick handler for MenuItem.
Build: Pass
public
mit
75 KB

PICK US NOW

React Loaders

Loaders turn waiting for data into an awesome user experience, eliminating white screens and telling users that data is on its way. Choose an awesome loader animation component for your React app.
semantic-ui-react /
loader
v0.88.2
A loader alerts a user to wait for an activity to complete.
Build: Pass
public
mit
72 KB
react-spinners /
bar-loader
v0.5.1
simple line bar loader which changes his speed while running
Build: Pass
public
mit
9 KB
react-spinners /
rise-loader
v0.5.1
rising and falling five dots loader
Build: Pass
public
mit
8 KB
react-spinners /
clip-loader
v0.5.1
clipped pulsing spinner
Build: Pass
public
mit
8 KB
react-spinners /
pulse-loader
v0.5.1
three pulsing dots loader
Build: Pass
public
mit
8 KB
react-spinners /
skew-loader
v0.5.1
rotating triangle loader
Build: Pass
public
mit
8 KB
react-spinners /
fade-loader
v0.5.1
circled loader with fading lines
Build: Pass
public
mit
9 KB
react-spinners /
grid-loader
v0.5.1
flickering nine dots grid loader
Build: Pass
public
mit
9 KB
react-spinners /
dot-loader
v0.5.1
two chasing dots loader
Build: Pass
public
mit
8 KB
react-spinners /
hash-loader
v0.5.1
circling four dots which turns into hash sign loader
Build: Pass
public
mit
9 KB
react-spinners /
propagate-loader
v0.5.1
one dot splits into six dots loader
Build: Pass
public
mit
9 KB
wired-elements /
wired-spinner
v1.0.0
Hand-drawn sketchy spinner to show progress or a pending tas...
Build: Pass
public
mit
11 KB
Build: Pass
public
mit
8 KB
le
shared-ui /
spinner
v0.0.2
Renders a `Spinner` component into an `IconButton`.
Build: Pass
public
mit
5 KB
react-spinners /
pacman-loader
v0.5.1
pacman eating infinite dots loader
Build: Pass
public
mit
9 KB
react-spinners /
sync-loader
v0.5.1
three dots dancing loader
Build: Pass
public
mit
8 KB
react-spinners /
beat-loader
v0.5.1
bouncing three dots loader
Build: Pass
public
mit
8 KB
react-spinners /
scale-loader
v0.5.1
five lines creates a bar / equalizer loader
Build: Pass
public
mit
8 KB
react-spinners /
ring-loader
v0.5.1
two rotating spinners creates a nice 3D loader
Build: Pass
public
mit
9 KB
primereact /
progressspinner
v4.2.0
ProgressSpinner is a process status indicator.
Build: Pass
public
mit
5 KB
chevron_leftLeft
More Examples
Rightchevron_right
semantic-ui-react /
loader
v0.88.2
A loader alerts a user to wait for an activity to complete.
Build: Pass
public
mit
72 KB
react-spinners /
bar-loader
v0.5.1
simple line bar loader which changes his speed while running
Build: Pass
public
mit
9 KB
react-spinners /
rise-loader
v0.5.1
rising and falling five dots loader
Build: Pass
public
mit
8 KB
react-spinners /
clip-loader
v0.5.1
clipped pulsing spinner
Build: Pass
public
mit
8 KB