Getting Started

Welcome to the Onsen UI Playground. Here you can interactively learn how to use Onsen UI components and test your own code with the latest Onsen UI version.

Tutorials are separated depending on the front-end framework and categories. Use the above menu to select tutorials in Vanilla JavaScript or with a specific framework: AngularJS, Angular 2+, React or Vue.js 2/3.

If you find any error, please hit "Improve this" button and send us a Pull Request or inform about it in the forum or chat. This tutorial is completely standalone so you can fork it and submit your own examples as PR to the repo.

Some tips:

• In the preview section you can switch between iOS and Android view for Automatic Styling.
• If you want to save any of these examples you can export the code to your Codepen account with "Export to Codepen" button.
• Report an issue on GitHub with the current code and browser information. Hit the "Report an issue" button after choosing a template in the above drop-down and changing the code to reproduce the issue.
• Press ‘ctrl + s’ to quickly refresh the preview.

You can ask anything in the community forum if you have issues. We hope you find this tool helpful, happy coding!