Create Dynamic Responsive Web Apps.
The most advanced framework for web apps ever created is packed with features to help you code single-page web apps faster than ever before.
Foundation for Apps is a framework that allows people and companies to build well designed future-friendly web apps. Foundation for Apps is designed to help you quickly prototype and build responsive web applications by using leading technologies like Flexbox and Angular.
Build any type of web app
An entirely new grid designed for making flexible, fully-immersive web apps.
-
Sexy email apps
Build a three-column email app on desktop computers with navigation and messages that slide in on mobile devices. It’s a perfect example of a responsive app that adjusts to many screen sizes.
View This Template → -
Complex Music Apps
Become the next big music streaming service — but unlike the big guys, make sure your app can work on every device with no need to download special software per platform.
View This Template → -
Look, a chat app too!
Build the perfect chat experience on a grid that lets you carve up screens into tons of useful pieces.
View This Template → -
So productive, girl
Productivity apps are hot. This template mimics some of the most popular side scrolling apps available.
View This Template → -
An immersive travel app
Split the screen in half and take full advantage of a large screen when you have it, then show the must have stuff on a smaller screen.
View This Template → -
Or something else entirely
Create a responsive app that's never been done before. And have it be seen by everyone on every device.
Get Started →
Built for making web apps
An entirely new grid, designed for making fully immersive and flexible web apps.
Vertical Grid
Use the power of Flexbox to carve screens into vertical sections — you’ll never rely on unreliable fixed-position headers again.
Independent Scrolling Sections
Create independently-scrolling sections that are inline on desktop computers and off-canvas on mobile devices.
A New Grid
Do more with a grid designed to work on any device.
Vertical Grid
Use the power of Flexbox to carve screens into vertical sections. You’ll never rely on unreliable fixed-position headers again.
Independent Scrolling Sections
Create independently-scrolling sections that can be inline on desktop computers and off-canvas on mobile devices.
Easier Source Ordering
Order the same divs on desktop computers, tablets and mobile devices in entirely different order with simple ordering classes.
Built on Angular
Make the power of AngularJS accessible to non-developers.
Templatizing Angular
Templatizing Angular Create simple Angular prototypes and apps without ever writing a line of Angular code. We create your Angular routes so you don’t have to — just name your views and URLs.
Component Driven
There’s no need to remember to call a div, ul or dl elements. Call our JS and CSS components with simple, custom HTML tags by prefixing your components’ names with “zf-”.
Add Motion to Views
Let users see when content changes by adding “enter” and “exit” motion classes to views. Simply define one of our predefined Motion UI classes at the top of your view and you’re done.
Motion UI
Create both eye-catching and subtle movements with a simple class or mixin.
Animation Classes
Create simple Angular prototypes and apps without ever writing a line of Angular code. We create your Angular routes so you don’t have to — just name your views and URLs.
Motion Modifiers
Change the default animations with modifier classes that affect the speed, ease and delay of animated elements.
Sass Mixins
Sass mixins are easy to use, so you can create custom animations without having to remember the complexities of keyframes.
Flexible Components
Mobile and desktop components, rethought to be more flexible than ever.
Notifications
Create native-app-like notifications on mobile devices and desktop browsers.
Action Sheets
Use ever-popular action sheets on mobile devices, and more appropriate drop-down menus on desktop browsers.
Wield the power of AngularJS with ease
Take the power of AngularJS and make it accesssible
Templatize Angular
Create simple Angular prototypes and apps without ever writing a line of Angular code. We create your Angular routes so you don’t have to — just name your views and URLs.
Component Driven
There’s no need to remember to call a div, ul or dl elements. Call our JS and CSS components with simple, custom HTML tags by prefixing your components’ names with “zf-”.
Add Motion to Views
Let users see when content changes by adding “enter” and “exit” motion classes to views. Simply define one of our predefined Motion UI classes at the top of your view and you’re done.