Ionic Framework alternative: Tailwind components you own

touchcn is a shadcn-style mobile UI component library for Angular, React, and Vue, and it’s a natural alternative to Ionic Framework — but a deliberately smaller one. Instead of installing components as a dependency and theming them through CSS variables, you copy the styled source into your repo and own every line, and it renders authentic Material 3 on Android and iOS 26 liquid glass on iOS from a single component set.

I want to be fair up front: Ionic is the incumbent for good reasons — a huge component set, its own router and native tooling, and years of production hardening. This post isn’t a takedown. It’s an honest comparison of two different trades, plus a look at what has changed around Ionic lately, so you can tell which trade fits the app you’re actually building.

The core difference

The two libraries disagree on three things: who owns the component code, how the platform look is produced, and how much of your app they try to be.

The ownership model is the biggest split. With Ionic, components arrive as an npm dependency. You consume them and theme them from the outside — CSS variables and Ionic’s theming APIs give you a lot of reach, but the component itself stays a black box you don’t edit. touchcn takes shadcn/ui’s approach instead: npx touchcn add <name> copies the styled component source into your repository. From that moment you own the markup, the classes, and the variants, and you change them by editing the file. The behavior and plumbing still live in versioned npm engine packages (@touchcn/core, @touchcn/angular, @touchcn/react, @touchcn/vue), so only the styling and markup land in your repo — the parts you actually want to tweak.

The usual objection to that model is losing upstream improvements once the code is copied. touchcn’s CLI closes that gap: 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. You get shadcn-style ownership without giving up a maintained upgrade path.

The platform look is the second split. touchcn renders authentic Material 3 with Material You dynamic color generated from a seed on Android, and iOS 26 liquid glass on iOS, switched at runtime with no platform conditionals in your app code. Glass and blur are iOS-only; on Android it uses opaque tonal surfaces and elevation rather than a translucent approximation. Ionic ships its own iOS-inspired and Material-inspired “modes” — a well-established in-house interpretation, but as of Ionic 8 it is not the iOS 26 liquid-glass look and has no Material You dynamic color.

The third split is scope. Ionic is a full framework: routing, lifecycle, navigation, native tooling, and a large ecosystem. touchcn is only the component layer — you bring your own router and app structure. Both are plain web tech and run anywhere the web runs, so both pair with Capacitor or Cordova and both build installable PWAs.

What’s happening at Ionic

You can’t compare against Ionic in 2026 without mentioning the elephant in the room. In February 2025, Ionic (part of OutSystems) announced it was halting new sales of all its commercial products — Appflow, Identity Vault, Auth Connect, Secure Storage, and Portals — and beginning a multi-year wind-down. Appflow, the CI/CD and live-update service, runs through December 31, 2027, after which its services shut off.

Two things are worth keeping straight about that announcement. First, Ionic Framework itself is not going away: the framework and Capacitor remain free, open source, and actively maintained as part of the OutSystems mobile stack — Ionic 8.7.x releases have continued shipping. Second, the wind-down still changes the calculus for a lot of teams: the commercial safety net that made Ionic the default enterprise choice is disappearing, and many teams are using the moment to re-evaluate their whole UI stack. If that’s you, it’s worth knowing what a gradual migration looks like — which is the next section.

Migrating from Ionic, incrementally

touchcn components are plain DOM elements, so they render happily inside ion-content. That means you don’t have to migrate an Ionic app in one big rewrite: install touchcn alongside Ionic, replace UI leaf-first — buttons and lists before pages and navigation — and remove Ionic once nothing depends on it. The Ionic guide covers the coexistence rules (CSS boundaries, structure conflicts) and the full migration path.

There’s also an agent skill for it: touchcn-ionic-migration teaches Claude Code, Cursor, and other compatible tools the Ionic-to-touchcn component mapping and the migration order, so you can point an AI agent at your app and ask it to do the mechanical part:

npx skills add capawesome-team/touchcn --skill touchcn-ionic-migration

Which should you choose?

Ionic remains hard to beat if you want a complete framework: a huge component set, official routing, native tooling, and a decade of production hardening. If you’re happy consuming components as a dependency and the commercial wind-down doesn’t affect you, it is still a solid choice. touchcn makes a different trade — it is just the component layer, but the source lands in your repo so you own every line (and can still pull upstream updates), it is Tailwind-native, and it targets the newest platform design languages — iOS 26 liquid glass and Material You dynamic color — rather than an in-house approximation.

Choose touchcn if:

• You want to own and edit your component source rather than theme a black-box dependency.
• You already use Tailwind.
• You want the newest platform looks — iOS 26 liquid glass and Material You dynamic color.
• You need Angular, React, or Vue and just the component layer, not a whole framework.

Choose Ionic if:

• You want a mature, batteries-included framework with the largest ecosystem.
• You need a big component set, official routing, and native tooling today.
• You prefer consuming versioned components over owning source.
• You build with vanilla JS — touchcn does not support that.

FAQ

Is touchcn a drop-in replacement for Ionic?

No. Ionic is a full framework — routing, a large component set, native tooling; touchcn is only the styled component layer. You keep your own router (Angular Router, React Router, Vue Router) and use touchcn for the UI. For many apps that is enough, but Ionic covers more surface area today.

Is Ionic Framework still maintained in 2026?

Yes. Ionic Framework and Capacitor remain free, open source, and maintained as part of the OutSystems mobile stack. What is winding down are Ionic’s commercial products — Appflow, Identity Vault, Auth Connect, Secure Storage, and Portals stopped new sales in February 2025, and Appflow’s services end on December 31, 2027.

Does touchcn work with Capacitor like Ionic does?

Yes. touchcn is plain web tech, so it runs anywhere the web runs — Capacitor and Cordova apps and installable PWAs. Capacitor is framework-agnostic, so you can pair it with touchcn without Ionic.

Can I migrate an Ionic app to touchcn incrementally?

Yes, screen by screen. touchcn components are plain DOM and render inside ion-content, so you can run both side by side and replace UI leaf-first. The Ionic guide covers coexistence and the migration path, and the touchcn-ionic-migration agent skill teaches AI coding tools the component mapping and migration order.

Why is touchcn called a shadcn-style library?

It follows shadcn/ui’s ownership model: a CLI copies styled component source into your project instead of installing an opaque package, so you edit markup, classes, and variants directly. Unlike classic shadcn, touchcn also ships diff and update commands that merge upstream changes into your copies without losing your edits.

If touchcn sounds like the right trade for your app, the getting-started guide walks you through your first component.