Ionic Components

The Ionic Framework Component Library

Ionic, Onsen, Konsta, Quasar met Ionic Framework 20,753 (github.com/ionic-team/ionic-framework (https://github.com/ionic-team/ionic-framework 52,684 ), MIT) as Framework7 572,986 's closest rival. Its toolbars, lists, tabs, modals, toasts and form controls are Web Components compiled by the Ionic team's Stencil 672,850 into @ionic/core; @ionic/react, @ionic/vue and @ionic/angular are thin wrappers that make them feel native to each framework.

Every component has two designs, called modes: ios follows Apple's Human Interface Guidelines and md Material Design 15,533 . Ionic picks the mode from the platform; you can force one with setupIonicReact({ mode: 'ios' }), or for testing with the ionic:mode query parameter, which is how the browser half of this figure was taken:

The same Ionic React catalog (Section 4.13.4) in Material Design mode on the Android emulator, just after a tap saved a book, and in iOS mode in desktop Chrome (?ionic:mode=ios): a centered title, bolder text and larger price notes
The same Ionic React 7,897 catalog (Plugins in Ionic) in Material Design mode on the Android emulator, just after a tap saved a book, and in iOS mode in desktop Chrome 1 (?ionic:mode=ios): a centered title, bolder text and larger price notes

BookNest's brown is --ion-color-primary and five variants in src/theme/variables.css. Ionic 9 came out on 19 August 2026 (9.0.5 on 23 September); version 8 apps upgrade with npx @ionic/migrate.