Frontend/UI

Tailwind CSS97.2k★

Tailwind flips the usual CSS approach: instead of writing classes in a separate file, you apply small utility classes directly in your markup. `class="flex items-center gap-4 bg-zinc-900 p-6 rounded-lg"`. That's your styling, right there in the HTML. No context-switching to a stylesheet. MIT licensed, used by basically every modern frontend framework. Tailwind v4 rewrote the engine. It's faster, uses CSS-native features like cascade layers, and the config moved from JavaScript to CSS. The ecosystem is massive: Tailwind UI (paid component library), Headless UI (free accessible components), and thousands of community component libraries. The framework itself is completely free. CLI, PostCSS plugin, Vite plugin. All free, all MIT licensed. No paid tier for the core framework. Tailwind UI is the paid product: $299 one-time for every component and template they've built. It's optional. You can build everything yourself or use free community alternatives like shadcn/ui or DaisyUI. Solo to large teams: the framework is free. Period. The question is whether to buy Tailwind UI to save design time, and at $299 one-time, the math works out immediately if it saves you even a day of work. The catch: your HTML gets verbose. Long class strings are polarizing. Some developers love the co-location, others find it unreadable. And Tailwind is opinionated about design tokens. If your design system doesn't align with Tailwind's spacing/color scale, you'll fight the config.

UnoCSS18.9k★

UnoCSS is an on-demand atomic CSS engine that generates only the utility classes your code actually uses, at build time with near-zero overhead. Same utility-first approach as Tailwind, but the engine is fundamentally different: regex-based extraction, instant HMR, and a preset system that can emulate Tailwind, Windi CSS, Bootstrap, or your own custom utilities. TypeScript. The speed difference is measurable. UnoCSS generates CSS in milliseconds where Tailwind's JIT takes longer on large projects. The preset architecture means you're not locked into one utility naming convention. Want Tailwind classes? Use the Tailwind preset. Want something custom? Write a preset in a few lines. Fully free. No paid tier, no cloud service, no premium presets. MIT-equivalent license. Solo to large teams: free. Drop it into Vite, Webpack, Nuxt, Astro, or SvelteKit. The Tailwind compat preset means migration from Tailwind is possible without rewriting your templates. The catch: UnoCSS has a smaller ecosystem than Tailwind. Component libraries like shadcn, DaisyUI, and Flowbite are built for Tailwind specifically. The Tailwind preset covers most classes but edge cases will break. If your team relies on Tailwind's documentation and component ecosystem, switching has a real cost beyond the CSS engine itself.

Redux Toolkit11.2k★

Redux Toolkit is the official way to use Redux without the boilerplate that made old Redux painful. It wraps Redux with sensible defaults: built-in immutable updates, auto-generated action creators, and a data fetching layer called RTK Query. MIT license, TypeScript-first. This is NOT a separate library from Redux: it IS how you're supposed to use Redux now. The old pattern of writing action types, action creators, and reducers separately is dead. Redux Toolkit gives you `createSlice` which generates all three from one function. Fully free. No paid tier, no hosted version. It's a dependency in your package.json. Every team size: free. The real question isn't cost; it's whether you need Redux at all. For simple apps, React's built-in useState and useContext are enough. Redux Toolkit earns its place when you have complex state interactions across many components, or when you need RTK Query's caching and invalidation. The catch: Redux still adds conceptual overhead. Actions, reducers, selectors, middleware, the mental model is heavy compared to simpler alternatives like Zustand or Jotai. RTK Query is powerful but competes with React Query/TanStack Query, which many developers find more intuitive. If you're starting fresh and don't already know Redux, try Zustand first.

react-native-skia8.5k★

React Native Skia puts Google's Skia graphics engine, the one that draws Chrome, Android, and Flutter, inside React Native. That means real 2D drawing: custom shapes, shaders, image filters, and animations that run at native speed instead of choking the JS thread. Shopify maintains it, it's MIT, and it's free. It's a native module, so it's not a drop-in npm package. You deal with native build steps, minimum platform versions, and a bigger app binary. Budget a little setup time and expect to rebuild the app, not just reload JS. Anyone building custom visuals in React Native, charts, drawing tools, elaborate transitions, wants this, solo or team, and it costs nothing. The catch is that it's low-level. Skia hands you a canvas and a brush, not finished components, so you write the drawing and animation logic yourself, and the newest high-performance backend is still experimental. Real power, real work.

boneyard6.8k★

Boneyard generates skeleton loading screens by snapshotting your actual UI. Instead of hand-coding placeholder layouts that drift from your real components, you wrap them in a Skeleton component, run the CLI, and it captures the exact layout at multiple breakpoints. The skeletons match because they are derived from the real thing. Works with React, Svelte 5, and React Native. The CLI opens a headless browser, finds your Skeleton wrappers, and outputs static JSON bone files. React Native support uses fiber tree walking instead of a browser, which is clever. Three animation styles (pulse, shimmer, solid), dark mode support, and incremental caching so rebuilds skip unchanged components. Frontend developers tired of manually measuring skeleton states: this saves real time. Especially valuable on data-heavy apps where perceived load time matters. Teams get loading states that stay in sync as designs evolve. The catch: the CLI needs a running dev server to snapshot from. Dynamic layouts that change shape based on data will not produce perfect skeletons. And if you change a component, you need to re-run the build.

SkiaSharp5.5k★

SkiaSharp gives .NET developers access to Skia, the same 2D rendering engine that powers Chrome, Android, and Flutter. Cross-platform from day one across Windows, macOS, Linux, iOS, Android, and WASM. Free and MIT-licensed. This is the answer for .NET apps that need to draw beyond what System.Drawing or WPF provides (System.Drawing is being deprecated cross-platform anyway). PDFs, charts, image manipulation, custom controls in MAUI or Avalonia. The API is procedural and predictable. Not particularly hand-holding, but the docs are decent. This is a primitive, not a product. There's no paid tier. You ship it inside your app via NuGet. Solo, small team, large team: same setup, just `dotnet add package SkiaSharp`. Performance is good because the heavy lifting is native code under the hood. The catch is that the cross-platform native binaries can be a deployment headache. AOT compilation, mobile linking, and self-contained publishing all need attention. Test your release builds on every target platform you care about, not just the one your dev machine runs.

flipoff3.0k★

FlipOff gives you one on any TV or monitor for free. Open an HTML file, go fullscreen, and you have a retro departure-board display without spending $3,500 on Vestaboard hardware. Vanilla HTML/CSS/JS, zero dependencies. Realistic scramble animation with recorded flap audio. Auto-rotating quotes, fullscreen TV mode, keyboard controls. Responsive from mobile to 4K. Works offline. Just open index.html. The community is already adding features: Docker support, JSON config, emoji support, GitHub Pages deployment. The catch: it's a fun display project, not a business tool. If you want it for a restaurant menu, office dashboard, or retail signage, it works great. If you want integration with data feeds, flight APIs, or custom backends, you'll need to build that yourself. No configuration UI; you edit JavaScript or JSON config directly.

tiny-vue2.3k★

TinyVue is an enterprise Vue component library from Huawei's OpenTiny team, covering 100+ components: data tables, forms, charts, and complex layouts. Supports both Vue 2 and Vue 3 from the same package, which is useful if you are maintaining a migration. MIT-licensed, fully free. No server setup. Install via npm and use it. The library uses a renderless architecture that separates logic from templates, making it relatively easy to customize without forking. Charts and form components are built in, which reduces dependency sprawl for enterprise dashboards. Vue teams building enterprise admin panels and internal tools should evaluate this alongside Element Plus and Ant Design Vue. Component breadth is competitive. The main consideration is documentation quality: comprehensive but primarily Chinese, with English translations that lag main releases. The catch: community support is predominantly Chinese-language. Debugging edge cases or finding answers on Stack Overflow is harder than with Element Plus or Ant Design Vue. If that friction bothers you, pick the more globally-adopted library.

fontaine2.0k★

Web fonts cause layout shift: the page renders in a fallback font, then jumps when your custom font finishes loading. fontaine kills that jump. It reads your @font-face declarations and builds a matching fallback from a local system font, with the ascent and descent tuned so the swap is invisible. The payoff is a better Cumulative Layout Shift score, one of Google's Core Web Vitals. MIT-licensed and free, from the unjs team. It's pure CSS at runtime, so there's no JavaScript cost on the page. The work happens at build time through plugins for Vite, Next.js, Astro, Nuxt, Gatsby, and Docusaurus. You add the plugin, point it at your fonts, and it injects the corrected fallback rules. No hand-calculating metrics, no fiddling with size-adjust yourself. If you ship custom web fonts and care about Core Web Vitals, and if you care about SEO or conversion you do, this is close to free performance. Solo developers and small teams: add it and move on. Larger teams running performance budgets get a measurable CLS win for a few lines of config. There's no paid tier and nothing to run. The catch is that fontaine solves one narrow problem and assumes you already have a sane font-loading setup. It won't fix fonts that load slowly, won't subset or self-host them for you, and the metric matching is very good but not always pixel-perfect on unusual typefaces. For the rest of the font pipeline, pair it with Fontsource or your framework's own font tooling.

persona889★

Persona gives your voice agent a face. It's a cross-platform desktop app that shows an animated character synced to voice output, the avatar moves and reacts in response to the audio coming out of your assistant or agent. It can pull in external tools over MCP, so the character isn't just a mouth, it can be wired to real capabilities. It's a polished little piece of work, with cross-platform installers and proper CI/CD behind it. The app code is MIT, though the character assets carry their own separate terms, worth noting if you plan to redistribute. Free for everyone, solo or team. Use it when you want a voice interface to feel like a presence instead of a disembodied speaker, a companion app, a kiosk, a streaming overlay. The catch is that this is a layer on top, not a foundation. It's an animated avatar for voice agents, the aesthetic and personality, not the reasoning or the plumbing. It also wants GPU acceleration and Node 24+. Charming and well-built, but understand you're adding a face to a system you still have to build.

ds.css571★

ds.css makes your web page look like a Nintendo DS. It is a small CSS framework that recreates the DS and DS Lite interface, the chunky buttons, the dual-screen chrome, the whole handheld aesthetic, as drop-in styles and web components. MIT-licensed and free, add it with one CDN link or an npm install. There is no build step and no ops, it is a stylesheet. Pull it from unpkg with a link tag, grab the files from dist, or install the npm package, and you are styling. That simplicity is the point: this is a theme, not a framework you architect an app around. Be clear-eyed about what this is, a novelty. It is a hobby project for building something with retro-console charm, a personal site, a game-jam entry, a portfolio piece with personality. For anything users rely on daily, reach for a real design system like Tailwind, Pico, or shadcn. For fun, ds.css delivers exactly what it promises. The catch is longevity and scope. It covers parts of the DS UI, not a complete component set, and it carries the activity profile of a passion project, not production tooling. Great for a weekend build, risky as a foundation.