TypeScript UI Components

Open-source TypeScript projects categorized as UI Components

Top 23 TypeScript UI Component Projects

  • storybook

    Storybook is a frontend workshop for building UI components and pages in isolation. Made for UI development, testing, and documentation.

  • Project mention: How to share your TwigComponent with your team ? | dev.to | 2024-05-15

    But here’s some good news: there’s already a solution in the JavaScript world called Storybook!

  • vuetify

    🐉 Vue Component Framework

  • Project mention: Top Material Design 3 web frameworks of 2024 | dev.to | 2024-01-23

    👉 https://vuetifyjs.com

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo
  • slate

    A completely customizable framework for building rich text editors. (Currently in beta.) (by ianstormtaylor)

  • Project mention: 5 Not-So-Typical React Libraries for an Outstanding Project | dev.to | 2023-08-03
  • react-select

    The Select Component for React.js

  • Project mention: Aplicando paginação em um componente Select | dev.to | 2024-04-09
  • mantine

    A fully featured React components library

  • Project mention: 10+ UI Libraries for Svelte to Try in 2024 | dev.to | 2024-05-14

    SvelteUI includes 50+ customizable, accessible Svelte components. The components are built with TypeScript and support it by default. In addition to the components, the library includes out-of-the-box actions, transitions, and utilities. In general, it's a nice-looking library, heavily inspired by Mantine, with good documentation. The latest major update was released in August 2023.

  • react-table

    🤖 Headless UI for building powerful tables & datagrids for TS/JS - React-Table, Vue-Table, Solid-Table, Svelte-Table

  • Project mention: Best Next.js Libraries and Tools in 2024 | dev.to | 2024-04-10
  • tiptap

    The headless rich text editor framework for web artisans.

  • Project mention: Encrypted Note Editor App In React Native | dev.to | 2024-03-04

    The Editor: The core of our app is the editor. We need an easy to use and robust rich text editor, that supports all of the features we want such as: headings, lists, placeholders, markdown, color, images, bold italic etc… For this we will use @10play/tentap-editor which is a rich text editor for react native based on Tiptap.

  • InfluxDB

    Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

    InfluxDB logo
  • react-dnd

    Drag and Drop for React

  • Project mention: Curious case of Drag and Drop | dev.to | 2024-01-30

    react-dnd is quite powerful but a bit complex and requires some getting used to.

  • NativeBase

    Mobile-first, accessible components for React Native & Web to build consistent UI across Android, iOS and Web.

  • Project mention: Exploring the Best UI Component Libraries for React Native apps | dev.to | 2024-03-29

    Gluestack, like any other customizable UI library, is built to make styling less cumbersome. It comprises a set of themed and unstyled components easily integrated across different platforms and devices. Originally, Gluestack was a part of NativeBase, a component library for both React and React Native. With performance and maintainability in mind, NativeBase was split into two parts, focusing on a universal CSS-in-JS library and an independent set of unstyled components. Gluestack has several advantages, some of which are:

  • lexical

    Lexical is an extensible text editor framework that provides excellent reliability, accessibility and performance.

  • Project mention: Quill – Your powerful rich text editor | news.ycombinator.com | 2024-04-19

    I remember using https://github.com/facebook/lexical for a project a year ago and mostly things worked our of the box.

    Any reason to prefer quill?

  • naive-ui

    A Vue 3 Component Library. Fairly Complete. Theme Customizable. Uses TypeScript. Fast.

  • Project mention: Vue UI kits/component libraries? | /r/vuejs | 2023-12-09

    You can also check NaiveUI https://www.naiveui.com/

  • TinyMCE

    The world's #1 JavaScript library for rich text editing. Available for React, Vue and Angular

  • Project mention: HugeMCE forks the last TinyMCE MIT license | news.ycombinator.com | 2024-05-17
  • primitives

    Radix Primitives is an open-source UI component library for building high-quality, accessible design systems and web apps. Maintained by @workos.

  • Project mention: Radix Primitives: an open-source UI component library | news.ycombinator.com | 2024-03-20
  • react-content-loader

    ⚪ SVG-Powered component to easily create skeleton loadings.

  • react-toastify

    React notification made easy 🚀 !

  • Project mention: Collab Chronicles: Exploring the Collaborative Experience | dev.to | 2024-04-23

    React Toastify

  • ag-Grid

    The best JavaScript Data Table for building Enterprise Applications. Supports React / Angular / Vue / Plain JavaScript.

  • Project mention: How To Enhance AG Grid with Avatars: Building a Collaborative Grid with React and Ably | dev.to | 2024-01-26

    In this post I’ll show you how, using the AG Grid component and Ably Spaces, you can create a React application that allows users to see not only who else is currently viewing the grid, but using a Flowbite Avatar Stack component, what row each user currently has selected.

  • react-spectrum

    A collection of libraries and tools that help you build adaptive, accessible, and robust user experiences.

  • Project mention: Adobe React Spectrum Libraries | news.ycombinator.com | 2024-05-05
  • react-icons

    svg react icons of popular icon packs

  • Project mention: How To Build Your Own Newsletter App? p.1 | dev.to | 2024-05-16

    Install the React Icons package, which allows us to use various icons within the application.

  • victory

    A collection of composable React components for building interactive data visualizations

  • Project mention: Level Up Your Web App with Stunning React Charts: Introducing the Top 10 React Charts Libraries | dev.to | 2023-07-31

    Victory is a set of modular charting components for React and React Native. Victory makes it easy to get started without sacrificing flexibility. Create one of a kind data visualizations with fully customizable styles and behaviors. Victory uses the same API for web and React Native applications for easy cross-platform charting.

  • tamagui

    Style React fast with 100% parity on React Native, an optional UI kit, and optimizing compiler.

  • Project mention: Maintainer Monday | dev.to | 2024-05-13

    You can check out the site for Tamagui here.

  • react-native-calendars

    React Native Calendar Components 🗓️ 📆

  • react-hot-toast.com

    Smoking Hot React Notifications 🔥

  • Project mention: Modal and Toast dynamic global apporach | /r/nextjs | 2023-12-07

    React-hot-toast manages its state outside of react you can have a look for yourself: https://github.com/timolins/react-hot-toast/blob/main/src/core/store.ts it just listens to changes that occur to their own managed store :) - pretty much how all "global state libraries" work

  • ng-zorro-antd

    Angular UI Component Library based on Ant Design

  • Project mention: An Overview of 25+ UI Component Libraries in 2023 | dev.to | 2023-09-10

    Ant Design: A solid option that is been used by a lot of heavy hitters, such as Tencent, Baidu, AliBaba, and more. Supports all modern browsers, SSR, esm, and even Electron. Has also community implementations for Angular, Vue, and more. Does use CSS-in-JS, so expect runtime overhead as well as AntD ways of doing things.

  • SaaSHub

    SaaSHub - Software Alternatives and Reviews. SaaSHub helps you find the best software and product alternatives

    SaaSHub logo
NOTE: The open source projects on this list are ordered by number of github stars. The number of mentions indicates repo mentiontions in the last 12 Months or since we started tracking (Dec 2020).

TypeScript UI Components related posts

  • HugeMCE forks the last TinyMCE MIT license

    2 projects | news.ycombinator.com | 17 May 2024
  • How To Build Your Own Newsletter App? p.1

    1 project | dev.to | 16 May 2024
  • SASS, CSS, or Tailwind: Which One Should You Choose?

    2 projects | dev.to | 15 May 2024
  • How I Build Paradise UI: A React UI Component Library

    7 projects | dev.to | 14 May 2024
  • TinyMCE 7.1 Release Notes - Overview

    1 project | dev.to | 8 May 2024
  • 9 React Calendar Components for Your Next App

    6 projects | dev.to | 25 Apr 2024
  • Collab Chronicles: Exploring the Collaborative Experience

    2 projects | dev.to | 23 Apr 2024
  • A note from our sponsor - SurveyJS
    surveyjs.io | 21 May 2024
    With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js. Learn more →


What are some of the best open-source UI Component projects in TypeScript? This list will help you:

Project Stars
1 storybook 82,997
2 vuetify 39,117
3 slate 29,078
4 react-select 27,297
5 mantine 24,724
6 react-table 24,223
7 tiptap 24,101
8 react-dnd 20,568
9 NativeBase 20,033
10 lexical 17,494
11 naive-ui 15,321
12 TinyMCE 14,433
13 primitives 14,392
14 react-content-loader 13,383
15 react-toastify 12,228
16 ag-Grid 11,857
17 react-spectrum 11,838
18 react-icons 11,132
19 victory 10,789
20 tamagui 10,155
21 react-native-calendars 9,229
22 react-hot-toast.com 9,199
23 ng-zorro-antd 8,763

SaaSHub - Software Alternatives and Reviews
SaaSHub helps you find the best software and product alternatives