Skip to content
touchcn
Esc
navigateopen⌘Jpreview
Blog

Is there a shadcn for mobile without React Native?

React Native Reusables and touchcn both bring shadcn's copy-paste model to mobile — for different runtimes: native views vs web (PWA, Capacitor). Which fits?

By Robin Genz

If you’ve searched for “shadcn for mobile” or “shadcn native,” you’ve probably landed on React Native Reusables — and if you’re not building with React Native, you’ve probably felt the mismatch. touchcn and React Native Reusables share one idea, shadcn’s copy-paste ownership model, but they target completely different runtimes.

React Native Reusables renders real native views in a React Native or Expo app. touchcn renders in the web platform — a PWA, mobile web, or a Capacitor or Cordova app — and re-skins itself as Material 3 on Android and iOS 26 liquid glass on iOS. Web-native, not React Native. This isn’t a quality contest; it’s a stack decision, and this post is here to make that decision obvious.

One idea, two runtimes

Both projects start from the same place: shadcn’s copy-paste ownership model. Instead of importing opaque components from a package, a CLI copies the styled component source into your repository. You own every line, and when a component renders almost the way you need it to, you edit the file instead of fighting a wrapper. React Native Reusables (maintained by Founded Labs) applies that model to React Native; touchcn applies it to the web. If you like owning your components, you’ll feel at home in either.

touchcn adds one refinement to the model that’s worth knowing: copied source doesn’t go stale. touchcn diff shows what changed in the registry since you copied a component, and touchcn update applies those changes with a three-way merge that preserves your local edits — see the CLI docs. Behavior that shouldn’t be copy-pasted (measurement, focus trapping, ripple) lives in versioned npm engine packages, so plumbing fixes still arrive as ordinary npm updates.

The split is the runtime, and it decides almost everything else. React Native Reusables renders real native views through the React Native runtime, built with the Metro toolchain and shipped as native iOS and Android apps. touchcn renders in the DOM. It is plain web technology — Tailwind CSS v4 tokens plus Angular, React, or Vue components — so it runs anywhere the web runs: a PWA, mobile web, or a Capacitor or Cordova app. That single difference is what you’re actually choosing between.

touchcn React Native Reusables
Shared idea shadcn copy-paste ownership — source copied into your repo. shadcn copy-paste ownership — source copied into your repo.
Runtime Web platform (the DOM). React Native (native views via the RN runtime).
Where it runs PWA, mobile web, Capacitor or Cordova. iOS and Android native apps via React Native / Expo.
Frameworks Angular, React, Vue. React Native.
Design approach Per-platform authentic: Material 3 on Android, iOS 26 liquid glass on iOS, from one set. shadcn/ui design system adapted to React Native.
Styling Tailwind CSS v4 tokens with .ios / .md namespaces. Nativewind or Uniwind (Tailwind for React Native).
Uses web tooling Yes — standard web build, DOM, CSS. No — React Native / Metro toolchain and native builds.
Distribution CLI copies source; behavior lives in versioned engine packages. CLI copies source into your RN project.
License MIT, open source. MIT, open source.

Note that “React” means different things across the two rows. touchcn’s React is React on the web — components that render in the DOM. React Native Reusables uses React Native, a distinct runtime that renders native views. Same library name, different targets.

Which should you choose?

This is a stack choice, not a quality one — both are good, and both embrace shadcn’s copy-paste ownership model. The deciding question is your runtime. If you are building a true native app with React Native or Expo, React Native Reusables is the right fit: it renders native views and gives you shadcn/ui adapted to that world with Nativewind. If you are building with web technology — a PWA, mobile web, or a Capacitor or Cordova app — touchcn is the fit: it runs in the DOM, uses your existing web tooling, and renders per-platform authentic UI (Material 3 on Android, iOS 26 liquid glass on iOS) without adopting React Native.

Choose touchcn if:

  • You build a web app, PWA, or a Capacitor/Cordova app with web technology.
  • You use Angular, React, or Vue on the web (the DOM), not React Native.
  • You want per-platform authentic looks (Material 3, iOS 26 liquid glass).
  • You want to style with Tailwind and reuse existing web tooling.

Choose React Native Reusables if:

  • You build a true React Native or Expo app that renders native views.
  • You want shadcn/ui adapted to React Native with Nativewind or Uniwind.
  • You need native modules, gestures, and platform APIs that RN provides.
  • Your team is committed to the React Native runtime rather than the web.

One honest caveat about touchcn: it is new and early — currently 40 components and 9 pre-composed blocks per framework, still growing. React Native Reusables is the established answer for its stack. But if your app is web-based, that is the trade — a younger project, aimed squarely at a runtime React Native Reusables was never built for.

FAQ

Is touchcn built on React Native?

No. touchcn is web technology — Tailwind CSS plus Angular, React, or Vue components that render in the DOM. React Native Reusables targets the React Native runtime and renders native views. If your app is web-based (including PWAs and Capacitor or Cordova apps), touchcn fits; if it is a React Native / Expo app, React Native Reusables fits.

Which is the real “shadcn for mobile”?

Both, for different stacks. React Native Reusables is shadcn for React Native; touchcn is shadcn for the mobile web and cross-platform web apps (Capacitor, Cordova, PWAs). They share the copy-paste ownership philosophy but do not compete for the same runtime.

Can I get native-feeling UI without React Native?

Yes — that is touchcn’s purpose. It renders authentic Material 3 on Android and iOS 26 liquid glass on iOS from web technology, so a Capacitor or Cordova app or a PWA can look platform-native without the React Native toolchain.

Do they share components or code?

No. They are separate projects with different runtimes. They share only the shadcn approach of copying styled component source into your repository so you own and edit it.

If touchcn sounds like the fit for your stack, the getting-started guide walks you through adding it to your app.

— Robin Genz