Stream helps developers build engaging apps that scale to millions with performant and flexible Chat, Feeds, Moderation, and Video APIs and SDKs powered by a global edge network and enterprise-grade infrastructure. Learn more →
Top 23 TypeScript Component Projects
-
shadcn/ui
A set of beautifully-designed, accessible components and a code distribution platform. Works with your favorite frameworks. Open Source. Open Code.
Project mention: From Zero to Deployed: A Step-by-Step Guide to Building a Full-Stack App with React Router and Cloudflare | dev.to | 2025-07-10Initialize shadcn/ui to easily add beautiful and accessible components.
-
SurveyJS
JavaScript Form Builder with No-Code UI & Built-In JSON Schema Editor. Keep full control over the data you collect and tailor the form builder’s entire look and feel to your users’ needs. SurveyJS works with React, Angular, Vue 3, and is compatible with any backend or auth system. Learn more.
-
storybook
Storybook is the industry standard workshop for building, documenting, and testing UI components in isolation
📚 4. Use Storybook (Seriously) If you’re not using Storybook for UI development, now is the time. It isolates your components from the app, which means:
-
But it has a CMS? The author said that replaced WordPress sites with Astro, and on https://astro.build/ I see a comparison to WordPress.
Astro brings a friendly UI to maintain and update the sites? Like the WordPress panel and editor.
-
headlessui
Completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.
Project mention: Tailwind CSS vs. Bootstrap: Which Framework is Better for Your Project? | dev.to | 2025-03-12Tailwind CSS ecosystem features growing resources like Tailwind UI (a component library), Headless UI (unstyled, accessible components), and community-built plugins. It’s maintained by a smaller company (Tailwind Labs) but has very active development and a dedicated community of web developers.
-
Project mention: Demystifying npm package installation: Insights, analysis and optimization tips | dev.to | 2025-04-22
In order to run each scenario, there must be a package.json file present. For this analysis, we will use the following package.json file. This is a real package.json file, that I've used when creating a simple demo of Recharts library.
-
Project mention: InboxNegotiator: Turning Debt Reminders into Payment Plans with AI and Postmark | dev.to | 2025-06-08
UI: shadcn/ui + HeroUI for a modern, responsive interface.
-
-
InfluxDB
InfluxDB – Built for High-Performance Time Series Workloads. InfluxDB 3 OSS is now GA. Transform, enrich, and act on time series data directly in the database. Automate critical tasks and eliminate the need to move data externally. Download now.
-
Blueprint UI
-
office-ui-fabric-react
Fluent UI web represents a collection of utilities, React components, and web components for building web applications.
After this article I had an interesting exchange with David Rivard on how to manually tweak the style of Fluent UI 9 controls to make it look like the standard, model-driven, ones.
-
nivo
nivo provides a rich set of dataviz components, built on top of the awesome d3 and React libraries
Project mention: Show HN: I'm an airline pilot – I built interactive graphs/globes of my flights | news.ycombinator.com | 2025-06-27Cool viz, I guess it's using https://nivo.rocks/?
-
-
No easy way to do this, and the level of abstraction can vary a lot between projects. For example, if you are using Angular and you have one of the well-known packages such as PrimeNG, where you will use a modal. You can use it directly from the library, but what will you do if you want to update or even replace the entire library?
-
Project mention: Show HN: Self-Hostable Algolia DocSearch Replacement | news.ycombinator.com | 2024-10-11
Example PR: https://github.com/microsoft/fast/pull/7031/files
If you want hosted-search:
-
-
-
-
-
→ https://manifest.build/#cta-cloud
-
-
-
blocksuite
🧩 Content editing tech stack for the web - BlockSuite is a toolkit for building editors and collaborative applications.
-
searchkit
React + Vue Search UI for Elasticsearch & Opensearch. Compatible with Algolia's Instantsearch and Autocomplete components.
-
AutoImport from "unplugin-vue-components/vite"
-
Stream
Stream - Scalable APIs for Chat, Feeds, Moderation, & Video. Stream helps developers build engaging apps that scale to millions with performant and flexible Chat, Feeds, Moderation, and Video APIs and SDKs powered by a global edge network and enterprise-grade infrastructure.
TypeScript Components discussion
TypeScript Components related posts
-
Top 7 Open-Source Projects to Contribute to in 2025
-
🎯 How to Ensure Pixel-Perfect UI in React Apps
-
Theory of Abstraction
-
Documentando componentes React com Storybook
-
Beyond switch-case: Type-safe Pattern Matching in TypeScript
-
Resume Scan AI app built with Next.js 15, Tailwind CSS, BetterAuth, Open AI, Inngest, and Shadcn/ui
-
10+ Stunning React Icon Library
-
A note from our sponsor - Stream
getstream.io | 15 Jul 2025
Index
What are some of the best open-source Component projects in TypeScript? This list will help you:
# | Project | Stars |
---|---|---|
1 | shadcn/ui | 90,551 |
2 | storybook | 87,209 |
3 | astro | 52,186 |
4 | headlessui | 27,611 |
5 | recharts | 25,562 |
6 | heroui | 24,828 |
7 | vant | 23,953 |
8 | @blueprintjs/core | 21,143 |
9 | office-ui-fabric-react | 19,393 |
10 | nivo | 13,663 |
11 | omi | 13,187 |
12 | primeng | 11,766 |
13 | fast | 9,483 |
14 | cosmos-js | 8,503 |
15 | reakit | 8,276 |
16 | React95 | 6,968 |
17 | react-native-ui-lib | 6,872 |
18 | skeleton | 5,588 |
19 | ngx-bootstrap | 5,539 |
20 | aleph.js | 5,252 |
21 | blocksuite | 5,076 |
22 | searchkit | 4,827 |
23 | unplugin-vue-components | 4,112 |