Kargo automates promotion across dev, staging, and prod with approval gates and verification. Open source, built by the team behind Argo CD. Download now. Learn more →
Top 23 TypeScript Figma Projects
-
onlook
The Cursor for Designers • An Open-Source AI-First Design tool • Visually build, style, and edit your React App with AI
Project mention: Loupe VS onlook - a user suggested alternative | libhunt.com/r/winchxyz/loupe | 2026-07-22Onlook is a visual editor for existing React/Tailwind codebases; Loupe builds the site from a prompt and verifies every AI edit against the real render, with hand editing on the live page.
-
AppSignal
Monitoring that respects your time & budget. APM, error tracking, and dashboards for modern web apps. Ten-minute setup, transparent flat pricing, and support from engineers who actually use the product.
-
lucide
Beautiful & consistent icon toolkit made by the community. Open-source project and a fork of Feather Icons.
The other half was already solved too. I use Lucide in everything I build. 1,756 glyphs on a 24 unit grid with a 2 pixel stroke, and somebody has already had the argument about what a "database backup" icon should look like. That argument is the hard part of building an icon set, and it was done.
-
It's convenient to place the rules in a separate directory. For example, create a .cursor folder in the project root and put all rules inside a rules folder within it. Be sure to give the AI agent a link to the rules. Here's also an example of a detailed set of rules from another project configured with Framelink MCP:
-
mitosis
Write components once, run everywhere. Compiles to React, Vue, Qwik, Solid, Angular, Svelte, and more.
Project mention: Mitosis: Write Components Once, Run in React, Vue, Qwik, Solid, Angular, Svelte | news.ycombinator.com | 2026-01-29 -
-
iconoir
An open source icons library with 1600+ icons, supporting React, React Native, Flutter, Vue, Figma, and Framer.
-
-
Kargo
Stop Scripting Promotions. Start Shipping with Kargo. Kargo automates promotion across dev, staging, and prod with approval gates and verification. Open source, built by the team behind Argo CD. Download now.
-
I’ve been working on an Angular component library called Taiga UI for many years. Everything I’ll talk about in this article comes from there, but that’s just the backstory. We won’t need Angular or any of its specifics here. We’re talking pure CSS. Our library uses a custom scrollbar. While modern browsers let you tweak its appearance a bit, for full control over behavior and visuals, we need to place our own elements inside the container to act as the scrollbar. But how do you do that when absolutely positioned elements fly to the top on scroll, and fixed-position ones are pinned to the viewport?
-
-
figma-console-mcp
Your design system as an API. Connect AI to Figma for extraction, creation, and debugging.
-
react-zoom-pan-pinch
🖼 React library to support easy zoom, pan, pinch on various html dom elements like <img> and <div>
-
-
-
-
design-tokens
🎨 Figma plugin to export design tokens to json in an amazon style dictionary compatible format.
-
create-figma-plugin
:battery: The comprehensive toolkit for developing plugins and widgets for Figma
-
-
functional-ui-kit
Precise Figma & React components. Packed with best practices, unified prop names & consistent design and code.
-
assistant
🤖 Bring your Figma design & development pipeline to the next level - with design to code, in-design-content-management, component management, tools for faster design
-
figma-use
Control Figma from the command line. Full read/write access for AI agents — create shapes, text, components, set styles, export images. 100+ commands.
Project mention: Show HN: Figma-use – CLI to control Figma for AI agents | news.ycombinator.com | 2026-01-17 -
-
-
-
SaaSHub
SaaSHub - Software Alternatives and Reviews. SaaSHub helps you find the best software and product alternatives
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 Figma discussion
TypeScript Figma related posts
-
Figma Console MCP
-
Lucide: Open-source icon library with 1600 vector (SVG) files for icons
-
Design-memory: Extract and reproduce design systems from any website
-
Speeding Up Layout from Figma with MCP and Cursor
-
Beautiful and Consistent Icons
-
Comparison of the Best Figma To Code AI Tools
-
Simplest Guide to use Figma MCP Server
-
A note from our sponsor - Kargo
akuity.io | 15 Sep 2026
Index
What are some of the best open-source Figma projects in TypeScript? This list will help you:
| # | Project | Stars |
|---|---|---|
| 1 | onlook | 26,709 |
| 2 | lucide | 24,446 |
| 3 | Figma-Context-MCP | 15,813 |
| 4 | mitosis | 14,382 |
| 5 | FigmaToCode | 5,179 |
| 6 | iconoir | 4,547 |
| 7 | micro-agent | 4,324 |
| 8 | taiga-ui | 4,053 |
| 9 | React Figma | 2,689 |
| 10 | figma-console-mcp | 2,304 |
| 11 | react-zoom-pan-pinch | 1,921 |
| 12 | plugin-samples | 1,848 |
| 13 | meteocons | 1,640 |
| 14 | figma-plugin | 1,606 |
| 15 | design-tokens | 1,123 |
| 16 | create-figma-plugin | 1,116 |
| 17 | idraw | 1,104 |
| 18 | functional-ui-kit | 619 |
| 19 | assistant | 618 |
| 20 | figma-use | 597 |
| 21 | metasearch | 537 |
| 22 | figma-to-react | 453 |
| 23 | react-native-figma-squircle | 356 |
Sponsored
Monitoring that respects your time & budget
APM, error tracking, and dashboards for modern web apps. Ten-minute setup, transparent flat pricing, and support from engineers who actually use the product.
www.appsignal.com