📦 Components & Libraries

Authentication & Authorization

• msal-community-solid - (NPM) - Authentication library for SolidJS SPAs based on the Microsoft Identity Platform

DX

• Solid Refresh (HMR) - (official) - HMR for Solid for various bundlers
• ESBuild Solid Plugin - (NPM) - Plugin to compile solid-js jsx components with ESbuild.
• Babel Solid Plugin - Undestructure - Destructure component props without losing reactivity
• Solid SFC(Experimental) - Experimental SFC compiler for SolidJS
• vite-plugin-inline-css-modules - Zero runtime plugin to write CSS modules inside of component files
• LocatorJS - Click on any component to go to it's code. (it's also built with SolidJS)
• ESLint for Solid - Solid-specific linting rules for ESLint
• Babel Solid Plugin - Labels - Simple, reactive labels for SolidJS

Form

• Felte
• Solar Forms
• Solid Forms - Making reusable form components easy and composable. Built upon solid-js/store.
• Solform - Very lightweight and simply managed forms.
• Solid-quiz - Simple quiz component
• Lexical Solid
• Solid Quill - (NPM)
• TipTap Solid
• Slate Solid
• FormGear
• Formisch - A form library with focus on performance, type safety and bundle size

Frameworks & Component Libraries

• Pigment - A design system built with Kobalte and Tailwind CSS
• Zag JS - UI components powered by Finite State Machines
• Flowbite SolidJS - Open-source UI components based on Flowbite and Tailwind CSS
• TW Elements SolidJS - Integrate Solid application with Open Source TW Elements - A free collection of UI components, templates, sections & plugins for Tailwind CSS.
• Ark UI - Ark UI is a headless library for building reusable, scalable Design Systems that works for a wide range of JS frameworks.
• Solid Bootstrap - The most popular front-end framework, re-built for SolidJS
• Suid - A port of Material-UI (MUI) built with Solid.js
• Solid RevKit - RevKit UI for SolidJS
• Solid ARIA - A library of high-quality primitives that help you build accessible user interfaces with SolidJS
• Solid CodeMirror - CodeMirror 6 component for SolidJS
• Solid CodeMirror - CodeMirror 6 component for SolidJS (yes, there are two)
• Solid Knobs - Primitives for building user-friendly controls with SolidJS
• Solid Material
• Mystic UI - Cool and beautiful animated components, crafted with Tailwind / PandaCSS and Motion One. Unofficial port of Magic UI for Solid.
• Solid Headless - Headless UI for SolidJS
• Kobalte - An unstyled UI toolkit for building accessible web apps and design systems
• FlyonUI - FlyonUI with SolidJS and Tailwind CSS to create a modern, responsive UI, simplifying your development workflow with ease.

Helpers

• Solid Signals
• Solid Request
• Solid Use - A collection of SolidJS utilities
• Solid Immer
• Solid Proxies - Solid.js library adding signaling to built-in non-primitives
• Solid Hooks - A high-quality & reliable Solid Hooks library.
• Solid Primitives

Internationalisation

• Solid Primitives — i18n - Library of internationalisation primitives.
• Typesafe i18n - SolidJS adapter for typesafe-i18n
• i18n-pro/solid - Lightweight, simple, flexible, automatic translation internationalization tool for Solid

Misc.

• Solid Keep-Alive - Keep you components alive even after parent's unmounts, saving signals and DOM elements in cache to reuse them.
• Solid Giphy
• Solid Emoji Picker - Unstyled emoji picker for SolidJS
• Solid Command Palette - UI Library for Command Palette in SolidJS webapps
• React2Solid
• Solid Firebase

Querying/GraphQL

• TanStack Solid Query - (NPM)
• Solid URQL
• @stitchapi/solid - (NPM) - Streaming-first StitchAPI bindings: typed, validated createStitch / createStitchStream primitives that reconcile a Solid store as response deltas arrive.

Routing

• Solid Typefu Router5
• Solid Tiny Router - Tiny routing library for SolidJS
• Solid App Router - (official)

SEO

• Solid Meta - (official)

SSR

• Solid Start - Official meta framework for SolidJS
• create-jd-app - The quickest and most efficient way to start new full stack, type safed Solid web app
• Solidus JS - Plug-and-Play SSR for SolidJS (In Development)

State Management

• Effector
• Solid Zustand
• Solid Nanostores
• Gstatem
• Solid Services
• Solid Jotai

Storage

• Fireproof - Pure JS, zero dependency, CRDT database for SolidJS - runs in the browser and connects to any cloud or backend
• Solid Cache - Resource caching in SolidJS
• Solid Dexie - Dexie(wrapper around IndexedDB) integration for Solid

Styling

• Solid Styled - Reactive stylesheets for SolidJS
• Discrete Typography - Experimental tool inspired by Capsize, implemented in Solid JS. Generates x-height and cap-height CSS

Testing

• Solid Jest - (official)
• Solid Testing Library - (official)
• solid-register

UI Components

• Phosphor Solid
• AutoAnimate
• Solid DnD
• TanStack Virtual - (NPM)
• Solid Toast - (NPM)
• Solid Simple Table - (NPM)
• Solid Table - (NPM)
• Solid Popper
• Solid Dismiss
• Solid Ninja Keys
• Solid Tippy - (NPM)
• Solid Floating UI
• Solid Split Pane
• Solid Icons - (NPM)
• Solid HeroIcons - (NPM)
• Solid SVG - (NPM)
• Solid Slider
• Solid ApexCharts
• Solid Flip
• Solid MapGL
• Solid Markdown - Render Markdown as Solid components
• Solid MDX
• Solid DND Directive
• Neodrag - (NPM)
• Solid Virtual Container - (NPM)
• Virtua - (NPM)
• Perfectly Scrollable - (NPM)
• Solid Select
• Solid Readotron - (NPM)
• Solid Chart.js - (NPM)
• Solid Particles - Particles, confetti, fireworks and more animations
• Solid Multi-select
• TanStack Solid Table - (NPM)
• Unplugin Icons - (NPM)
• Solid Transition Group - (official)
• Solid Spring
• Solid MotionOne
• dnd kit - SolidJS adapter for dnd kit
• Solid Sonner - (NPM)

Web Components

• Solid Element - Library for authoring web components with SolidJS.
• Lume Element - Fast and simple custom elements

Works with Solid

• Astro
• Vite Plugin - SSR - (Solid Example)
• Mitosis - (playground)

Resources

Apps/Websites

• ambient-rvx.web.app
• Made in Solid - SolidJS Portfolio — What have people built with it?
• artbyqreature.com

✍️ Blog Posts

• Introducing the SolidJS UI Library
• SolidJS Official Release: The long road to 1.0
• SolidJS: The Tesla of JavaScript UI Frameworks?
• JavaScript Frameworks and Metagaming
• A Look at Compilation in JavaScript Frameworks
• JavaScript UI Compilers: Comparing Svelte and Solid
• A few reasons why I love Solid.js
• The Real Cost of UI Components Revisited
• Solid - The best JavaScript UI library?
• 5 Ways SolidJS Differs from Other JS Frameworks
• A Hands-on Introduction to Fine-Grained Reactivity
• Building a Reactive Library from Scratch
• Building JavaScript Frameworks to Conquer eCommerce
• JavaScript vs JavaScript. Fight!
• Solid.js feels like what I always wanted React to be
• 5 Reasons why we chose to transpile to SolidJS instead of React
• Front-end Studio powered by SolidJS
• 5 Places SolidJS is not the Best
• The Journey to Isomorphic Rendering Performance
• How we wrote the Fastest JavaScript UI Framework, Again!

Community

• Reddit
• Discord

🏃 Examples and Starter Kits

• Official Examples
• Kauchicups
• TailwindCSS Layouts
• Todo MVC
• Hacker News
• Realworld
• Whiteboard
• Solid Templates - (official)
• Vite + Solid + TailwindCSS Starter
• Solid + Supabase Starter Kit - Solid + Supabase Starter Kit is an opinionated boilerplate, with all the bells and whistles you want ready, up and running when starting a SolidJS project with Supabase
• Solid + Wundergraph - Build applications with SolidJs and WunderGraph
• create-solid-library - Create a new Solid component library in seconds!
• Solid + Vite + Electron Starter - Build an Electron app with SolidJS
• DBEST Stack - DrizzleORM, Bun, ElysiaJS, SolidStart, Tailwind CSS stack.

Official Resources

• Official Guide
• Official Tutorial
• API Reference
• Release Notes
• Resource Index
• GitHub Repo
• Playground

Online Courses

• Solid JS & Firebase - The Complete Guide (Twitter Clone App) - (Udemy Course Paid)

Open Source

• Codeimage.dev - Create elegant screenshots of your source code. Built with SolidJS
• Bloki.app - Blocks-based collaborative editor
• Tura - Tura is a local, open-source coding agent for developers who are tired of vague skill claims, token-saving extensions with no evidence, and agents that change a repository before understanding it. Its desktop GUI is built with SolidJS.more coming soon...

🗣️ Podcasts

• The Deep Dive Episode 4: Reactive frontend frameworks
• React vs Svelte vs Solid & MicroFrontends | Ryan Carniato - On the hard choices all companies are facing right now with their websites, especially with the performance
• Ryan Carniato on SolidJS - Discussion on some of the similarities and differences between different UI frameworks, and talk about what things SolidJS has taken from react The Runtime Podcast
• A Solid option for building UIs - JS Party

Tutorials

• Solid.js for X developer - . A brief guide for Vue, Svelte and React developers to Solid.js.

📹 Videos/Screencasts/Twitch

• React to Solid - Stream With Ryan Carniato
• Solid.js - the NEXT React? In-depth Code Analysis
• REACTive Context in Solid.js
• Solid.js - A Fast, Declarative, Compiled Web UI Library - Better than React.js?
• Hottest React Competitor
• React vs SolidJS, Fight!
• Let's Learn SolidJS
• Fine-Grained Reactivity
• First look at DOM Expressions
• Streaming SolidJS - Context, Async, & Suspense
• Streaming SolidJS - Server Rendering
• Streaming SolidJS: Routing
• Streaming SolidJS: Concurrent Rendering without a Virtual DOM
• Streaming HTML, Solid 1.3, and More

🛠️ Tooling

• bun-plugin-solid - A plugin to compile Solid.js with Bun.
• ArkEnv - Environment variable validation from editor to runtime, integrates with Solid and SolidStart via its Vite plugin.