One codebase. Any platform. All with React.Vue.Angular.

Ionic Framework is an open source UI toolkit for building modern, high performance cross-platform apps from a single codebase.

supported icons
phone diagram
phone diagram
phone diagram
Feather icon
Lightweight & fast

Built to be fast and efficient by default, with hardware accelerated transitions, and touch-optimized gestures.

shapes icon
Cross-platform UI

Create modern, flexible UIs for all major app platforms and the Web—from a single shared codebase of HTML, CSS, and JavaScript.

bracketed bullet point icon
Framework-agnostic

Bring your favorite JavaScript Frameworks—or none at all. Build apps with Angular, React, Vue, or just plain Vanilla JS.

Visa logo
CAT construction logo
Burger King Logo
Aflac Logo
NBC Logo
Southwest Logo
H&R Block logo
General Electric Logo

From startups to enterprise—the world's best teams use Ionic to build their app UIs. See how →

Hybrid vs. Native ebook cover

Learn the differences between hybrid and native. We break down all the myths and misconceptions.

Read the free eBook →

Features

Everything you need to build incredible app UIs

Speed icon
Performant

Leverage the latest Web and JS features that perform and run fast on all of the latest mobile devices.

Cross platform icon
Cross-platform

Reach users on every platform and deploy to multiple devices from a single codebase.

bullet in brackets icon
React, Angular, Vue

Work with built-in support for popular JS frameworks, or use without a framework at all.

Crescent moon and stars dark mode icon
Built-in dark mode

Give your users light/dark theme choices so they can choose what’s most eye-friendly.

Typescript Logo icon
TypeScript Support

Ionic helps you adhere to best practices for web developers by type checking your code.

UI switches icon
Adaptive UI

Every Ionic Framework component auto-adapts its look and feel to the platform on which it’s running.

Processor Chip icon
Native-like gestures

Enable the same native gestures and behaviors that your users are accustomed to.

Shapes icon
100+ UI components

Build with 100+ pre-designed UI components, typography, and base themes that adapt to each platform.

Leaf icon
Tree-shakable

Automatically remove dead code when bundling multiple JavaScript files into single files.

Accessibility icon
Built-in accessibility

Get keyboard functionality and screen reader support to comply with non-visual access guidelines.

Native Performance icon
Native Performance

Optimized for mobile with hardware accelerated animations, lazy loading, and 60FPS scrolling.

Developer tooling icon
Developer-friendly tooling

Create, build, and test with Ionic CLI and leverage Live Reload, deployments, and top-notch Docs.

Build and preview right in your web Browser.

Ionic Framework components work anywhere—with integrations for the latest JavaScript frameworks like React or Vue, and can run standalone in a web page with just a script tag.

Explore UI Components
// action-sheet-example.component.ts
import { Component } from '@angular/core';
import { ActionSheetController } from '@ionic/angular';
@Component({
selector: 'action-sheet-example',
templateUrl: 'action-sheet-example.component.html',
styleUrls: ['./action-sheet-example.component.css'],
})
export class ActionSheetExample {
constructor(private actionSheetController: ActionSheetController) {}
async presentActionSheet() {
const actionSheet = await this.actionSheetController.create({
header: 'Albums',
cssClass: 'my-custom-class',
buttons: [{
text: 'Delete',
role: 'destructive',
icon: 'trash',
id: 'delete-button',
data: {
type: 'delete'
},
handler: () => {
console.log('Delete clicked');
}
}, {
text: 'Share',
icon: 'share',
data: 10,
handler: () => {
console.log('Share clicked');
}
}, {
text: 'Play (open modal)',
icon: 'caret-forward-circle',
data: 'Data value',
handler: () => {
console.log('Play clicked');
}
}, {
text: 'Favorite',
icon: 'heart',
handler: () => {
console.log('Favorite clicked');
}
}, {
text: 'Cancel',
icon: 'close',
role: 'cancel',
handler: () => {
console.log('Cancel clicked');
}
}]
});
await actionSheet.present();
const { role, data } = await actionSheet.onDidDismiss();
console.log('onDidDismiss resolved with role and data', role, data);
}
}
<!-- action-sheet-example.component.html -->
<ion-button (click)="presentActionSheet()">Show Action Sheet</ion-button>

Apps that are fast. Out-of-the-box.

Ionic is built to perform fast on the all of the latest mobile devices. Build apps with a small footprint and built-in best practices like hardware accelerated transitions, touch-optimized gestures, pre-rendering, and more.

Start building

Consistent

60 FPS

Native Scrolling

Out-of-the-box

100 %

Lighthouse PWA performance score

Down to

1.8 Sec

Average time to interactive

Up to

2 x

Faster than previous versions

Tech stack cluster logos image

Build apps with the tech you prefer.

We don’t make assumptions about the JS Frameworks you prefer to build with. That’s why we engineered Ionic to integrate seamlessly with all best frontend frameworks, including Angular, React, Vue, or even no framework at all.

Get started:

Customize to your heart’s desire.

Ionic’s intuitive theming lets you control every pixel to easily create custom, adaptive designs that match your brand and feel great across every device or screen. You’ll have access to everything you need to nail every detail.

iOS

Android

Custom

Mode

Cluster image of enterprise customer logos and developers working

Developer friendly. Enterprise ready.

More than 5 Million developers in over 200 countries around the world are using Ionic to power their app development. Join the thousands of global meetups, forums, and events that makes building with Ionic so much fun.

What folks say about Ionic.

Sean Bannigan profile photo
Sean Bannigan

@seanbannigan

I love building apps with Ionic and Capacitor because you can build UI that looks amazing, all with web technologies and a little plugin magic. As a user, I would never know this wasn’t a “native” app.

Angular profile photo
Angular
Twitter verified icon

@angular

Angular + Ionic represent a huge percentage of App Store and Google Play downloads

Nicole Sullivan profile photo
Nicole Sullivan

@stubbornella

Your care and attention to detail shows in @Ionicframework components. And your commitment to interoperability with frameworks is 💯

Einfach Hans profile photo
Einfach Hans

@einfach_hans_

I'm 23 years old and already can say: @Ionicframework changed my life. I'm proud to be able to describe myself as an Ionic Expert/Senior in my young age 👍🏻

Pato profile photo
Pato

@devpato

Starting playing with @Ionicframework again today. Holy shit! Things have changed in the past 4 years with Ionic. Excited to learn more and more about this awesome tool!

Marius Bolik profile photo
Marius Bolik

@MariusBolik

I refactored my cryptocurrency app in under a month using @Ionicframework & @capacitorjs.

Abimael Barea profile photo
Abimael Barea

@abimaelbarea

There are many options to build cross-platform apps. Still, the approach of @Ionicframework using web components, css variables, multi framework support, and now a straightforward integration with native code using Portals it's pretty impressive.

Steve Sanders profile photo
Steve Sanders

@StevenDSanders

One of the devs on my team added a fantastic dark mode to our new @Ionicframework app in less than a day of work.

Absolutely insane how productive you can be in Ionic! Let's just say that adding dark mode to our native iOS app took a lot longer than a day.

Danny Redfern profile photo
Danny Redfern

@redders66c

Why on earth did I not jump in @Ionicframework and @capacitorjs earlier?! The ease of using native plugins is outrageous.

FK - Cloud Architect profile photo
FK - Cloud Architect

@coderonfleek

You won't totally appreciate the work that the

@ionicframework team has done until you have read the entire docs. Such an amazing tool they have built

Maximillian profile photo
Maximillian

@maxedapps

Ionic is awesome! Building cross-platform apps has always been amazing with Ionic (and Capacitor) but Vue being Vue, it's of course super smooth and straightforward.

Glenn Nickens profile photo
Glenn Nickens

@GlennNickens

I luv @Ionicframework!

Waving hand emoji

Ionic has a vibrant, growing community. Join us.