Styleguide
Interactive Elements
In-text link
Sample code:
<a href=”#”>Link</a>
Rendered element:
Link
Buttons
CSS selector:
.button
Sample code:
<a href=”#” class=”button”>Class</a>
<button>Element</button>
Rendered element:
Class
Form Fields
Text Elements
Headings
Tag | Rendered element |
---|---|
<h1> | H1 |
<h2> | H2 |
<h3> | H3 |
Paragraphs
Sample code:
<p>…</p>
Rendered element:
Let’s do it again then, what the heck. You can create beautiful things - but you have to see them in your mind first. There it is. We’re not trying to teach you a thing to copy. We’re just here to teach you a technique, then let you loose into the world. Don’t be afraid to make these big decisions. Once you start, they sort of just make themselves. We’ll lay all these little funky little things in there.
Bulleted Lists
<ul>
<li>One</li>
<li>Two</li>
<li>Three</li>
</ul>
Rendered element:
- One
- Two
- Three
Numbered Lists
Sample code:
<ol>
<li>One</li>
<li>Two</li>
<li>Three</li>
</ol>
Rendered element:
- One
- Two
- Three
Combined Elements
Description
A battle between a mischeivious hungry raccoon and a stingy samurai who just wants order. Made in Maya. Watch the final video.