Welcome to Foundation in Hand Canvas

An Example By Dennis Schaaf

The Grid

This is a twelve column section in a row. Each of these includes a div.panel element so you can see where the columns are - it's not required at all for the grid.

Six columns

Six columns

Four columns

Four columns

Four columns

Tabs

Simple Tab 1
Simple Tab 2
Simple Tab 3
  • This is simple tab 1's content. Pretty neat, huh?
  • This is simple tab 2's content. Now you see it!
  • This is simple tab 3's content. It's, you know...okay.

Buttons

Small Blue Button

Medium Blue Button

Large Blue Button

Getting Started

You can enable hand-canvas while you are demonstrating your idea to a client to be able to show your progress, interactions, etc, but you make it clear that this is not a final design. And when you are ready for it mode take out hand-canvas and you have a fully functioning website!

Other Resources

Check Out the details: