Get started with framework7 CDN
MIT licensed
Framework7 is a free and open-source mobile app framework built with HTML, CSS, and JS, providing a native look and feel with iOS and Material Design.
Tags:- mobile
- framework
- ios 7
- ios7
- ios8
- ios 8
- iphone
- ipad
- apple
- phonegap
- native
- touch
- appstore
- app
- f7
- material
- android
- googleplay
Stable version
Copied!
How to start using framework7 CDN
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/framework7@8.3.2/css/framework7.bundle.css">
<script src="https://cdn.cdnhub.io/framework7/8.3.2/js/framework7.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/framework7@8.3.2/js/framework7-icons.min.js"></script>
<script>
document.addEventListener('DOMContentLoaded', () => {
new Framework7({
root: '#app', // App root element
id: 'myApp', // App ID
// App theme
theme: 'auto',
// App routes
routes: [
{ path: '/', component: './pages/home.html' },
{ path: '/about', component: './pages/about.html' },
],
});
});
</script>
</head>
<body>
<div id="app">
<header class="status-bar">
<div class="status-bar-inner">
<div class="status-bar-background"></div>
<div class="status-bar-icon">
<i class="material-icons">wifi</i>
</div>
<div class="status-bar-text">Connected</div>
</div>
</header>
<div class="views">
<router view></router>
</div>
</div>
<!-- Add your custom JS here -->
</body>
</html>
All versions
0.10.0
0.3.5
0.3.8
0.4.0
0.4.5
0.5.0
0.5.2
0.5.3
0.5.4
0.5.6
0.5.7
0.6.0
0.6.2
0.6.3
0.6.4
0.6.5
0.6.6
0.6.8
0.7.0
0.7.1
0.7.2
0.7.4
0.7.5
0.7.6
0.7.8
0.8.0
0.8.2
0.8.4
0.8.5
0.8.6
0.8.7
0.8.8
0.9.0
0.9.2
0.9.3
0.9.4
0.9.5
0.9.6
0.9.7
0.9.8
0.9.9
1.0.0
1.0.1
1.0.2
1.0.3
1.0.4
1.0.5
1.0.6
1.0.7
1.2.0
1.3.0
1.3.1
1.3.5
1.4.0
1.4.2
1.5.0
1.5.2
1.5.3
1.5.4
1.6.0
1.6.2
1.6.3
1.6.4
1.6.5
1.7.0
1.7.1
2.0.0
2.0.0-beta.1
2.0.0-beta.10
2.0.0-beta.11
2.0.0-beta.12
2.0.0-beta.14
2.0.0-beta.15
2.0.0-beta.16
2.0.0-beta.17
2.0.0-beta.18
2.0.0-beta.19
2.0.0-beta.2
2.0.0-beta.20
2.0.0-beta.21
2.0.0-beta.3
2.0.0-beta.4
2.0.0-beta.5
2.0.0-beta.6
2.0.0-beta.7
2.0.0-beta.8
2.0.0-beta.9
2.0.1
2.0.10
2.0.2
2.0.5
2.0.6
2.0.7
2.0.8
2.0.9
2.1.1
2.1.2
2.1.3
2.2.0
2.2.1
2.2.5
2.3.0
2.3.1
3.0.0
3.0.0-beta.10
3.0.0-beta.11
3.0.0-beta.12
3.0.0-beta.14
3.0.0-beta.15
3.0.0-beta.16
3.0.0-beta.17
3.0.0-beta.18
3.0.0-beta.19
3.0.0-beta.2
3.0.0-beta.3
3.0.0-beta.4
3.0.0-beta.5
3.0.0-beta.6
3.0.0-beta.7
3.0.0-beta.8
3.0.0-beta.9
3.0.1
3.0.5
3.0.6
3.0.7
3.1.0
3.1.1
3.2.0
3.2.1
3.3.0
3.3.1
3.3.2
3.4.0
3.4.2
3.4.3
3.5.0
3.5.1
3.5.2
3.6.0
3.6.1
3.6.2
3.6.3
3.6.5
3.6.6
3.6.7
4.0.0
4.0.0-beta.1
4.0.0-beta.10
4.0.0-beta.11
4.0.0-beta.12
4.0.0-beta.14
4.0.0-beta.15
4.0.0-beta.2
4.0.0-beta.3
4.0.0-beta.4
4.0.0-beta.5
4.0.0-beta.6
4.0.0-beta.7
4.0.0-beta.8
4.0.1
4.0.2
4.0.3
4.0.4
4.0.5
4.0.6
4.1.0
4.1.1
4.2.0
4.2.2
4.3.0
4.3.1
4.4.0
4.4.10
4.4.2
4.4.3
4.4.5
4.4.6
4.4.7
4.4.9
4.5.0
4.5.1
4.5.2
5.0.0
5.0.0-beta.1
5.0.0-beta.10
5.0.0-beta.11
5.0.0-beta.12
5.0.0-beta.14
5.0.0-beta.15
5.0.0-beta.16
5.0.0-beta.17
5.0.0-beta.19
5.0.0-beta.2
5.0.0-beta.20
5.0.0-beta.3
5.0.0-beta.5
5.0.0-beta.6
5.0.0-beta.7
5.0.1
5.0.2
5.0.3
5.0.4
5.0.5
5.1.0
5.1.1
5.1.2
5.1.3
5.2.0
5.3.0
5.3.2
5.4.0
5.4.0-beta.2
5.4.0-beta.3
5.4.1
5.4.2
5.4.5
5.5.0
5.5.1
5.5.3
5.5.5
5.6.0
5.7.0
5.7.1
5.7.10
5.7.11
5.7.12
5.7.13
5.7.14
5.7.2
5.7.5
5.7.6
5.7.7
5.7.8
5.7.9
6.0.11
6.0.12
6.0.14
6.0.15
6.0.16
6.0.17
6.0.18
6.0.19
6.0.20
6.0.21
6.0.22
6.1.0
6.1.0-beta.1
6.1.0-beta.2
6.1.0-beta.3
6.1.0-beta.4
6.1.0-beta.5
6.1.0-beta.6
6.1.0-beta.7
6.1.1
6.2.0
6.3.0
6.3.1
6.3.10
6.3.11
6.3.12
6.3.14
6.3.15
6.3.16
6.3.2
6.3.3
6.3.4
6.3.5
6.3.6
6.3.7
6.3.8
6.3.9
7.0.0
7.0.0-beta.10
7.0.0-beta.11
7.0.0-beta.12
7.0.0-beta.15
7.0.0-beta.16
7.0.0-beta.2
7.0.0-beta.20
7.0.0-beta.3
7.0.0-beta.4
7.0.0-beta.5
7.0.0-beta.6
7.0.0-beta.8
7.0.1
7.0.2
7.0.3
7.0.4
7.0.5
7.0.6
7.0.7
7.0.8
7.0.9
7.1.1
7.1.2
7.1.3
7.1.4
7.1.5
8.0.0
8.0.0-beta.1
8.0.0-beta.2
8.0.0-beta.3
8.0.0-beta.4
8.0.0-beta.5
8.0.0-beta.6
8.0.0-beta.7
8.0.0-beta.8
8.0.0-beta.9
8.0.1
8.0.2
8.0.3
8.0.4
8.0.5
8.1.0
8.2.0
8.3.0
8.3.1
8.3.2
*** 8.3.3