<h1> Magnetic HTML </h1>

<p> Stick the Internet to your fridge </p>

$6 on Amazon Prime! (★4.7)

Scattered HTML tiles

Want to learn web design? You don't even need a computer!

Each sheet of Magnetic HTML contains 153 tags and special characters. It makes a great gift for web developers, designers, and geeks.

Sheet of HTML tiles

Made in the USA, and packed and shipped by me from an apartment near Washington, DC. Tiles are .375" (~1cm) tall.

Some beautiful poetry

Shown above and below combined with the Magnetic Poetry "Geek" kit (not included).

Submitted by a user!

HTML tiles on the fridge

About

Magnetic HTML is inspired by my career teaching web development: I ask students to recreate a simple webpage using wooden tiles.

The original wooden HTML tiles

Each set includes the tags junior web designers are most likely to use; excluded are the tags junior web designers are most likely to abuse (like <hr/>, tables, and more than one <br/>).

Play

Click and drag the tiles to play with a working virtual prototype of a Magnetic HTML set.

 www.magneticHTML.com   <header>   </header> 
 <!-Made in the USA->   <footer>   </footer> 
 alert("Small parts")   <script>   </script> 
 <h1>   </h1>   &ldquo;   <canvas>   </canvas> 
 <h2>   </h2>   &rdquo;   <strong>   </strong> 
 <h2>   </h2>   &mdash;   <button>   </button> 
 <h3>   </h3>   </html>   <html>   <tr>   </tr> 
 <h3>   </h3>   </head>   <head>   <tr>   </tr> 
 <h4>   </h4>   </body>   <body>   <th>   </th> 
 <ol>   </ol>   </main>   <main>   <th>   </th> 
 <ul>   </ul>   </span>   <span>   <td>   </td> 
 <li>   </li>   </form>   <form>   <td>   </td> 
 <li>   </li>   </code>   <code>   <td>   </td> 
 <li>   </li>   <!DOCTYPE html>   <td>   </td> 
 <dl>   </dl>   <div>   </div>   <div>   </div> 
 <dt>   </dt>   <pre>   </pre>   &shy;   &nbsp; 
 <dt>   </dt>   <dfn>   </dfn>   &amp;   &copy; 
 <dd>   </dd>   <p>   </p>   <title>   </title> 
 <dd>   </dd>   <p>   </p>   <style>   </style> 
 <dd>   </dd>   <p>   </p>   <table>   </table> 
 <em>   </em>   <q>   </q>   <aside>   </aside> 
 <tr>   </tr>   <s>   </s>   <label>   </label> 
 </section>   <section>   &hellip;   &tradem; 
 </section>   <section>   <a href="#">   </a> 
 <img alt="   " src="#"/>   &lt;   &gt;   &pm; 
 <textarea>   </textarea>   <!--   --->   &ne; 

Up for a challenge?

Use virtual magnetic HTML tiles to create, save, and share your own webpage!

contact@robertakarobin.com