A template you can use to start building out your own style guides with.
.in-text-link
<a href="#" class="in-text-link">text link</a>
.button-nav
.select-btn
<a href="#" class="button-nav">Default Button</a>
<a href="#" class="select-btn">Select Button</a>
.btn-submit
<input class="btn-submit" type="submit" />
.btn-reset
<input class="btn-reset" type="reset" />
input[type=text]
input[type=text]:focus
lable
<form>
<label for="name">Name</label>
<input type="text" id="name" name="name" >
</form>
radio-button
<div class="radio-button">
<input id="option1" type="radio" name="option1">Yes
<div>
.image_link
<a href="#">
<img src="indoor_planter.jpg" class="image_link" alt="planter set"></a >
.heading1
.heading2
.heading3
.heading4
<a class="heading1">Heading example one</a><br>
.paragraphs
<div class="paragraphs"<p>The main focus of the company is to bring the world minimal but unique designs of home decorations made from sustainable materials. The most popular products are indoor planters that grow in modern pots and bottles. Having a glance at green can calm your mind and remind you of all the goodness in the world. </p> </div>The main focus of the company is to bring the world minimal but unique designs of home decorations made from sustainable materials. The most popular products are indoor planters that grow in modern pots and bottles. Having a glance at green can calm your mind and remind you of all the goodness in the world.
.nlist ol
<a class="nlist"><ol><li>Numbered list object one</li><li>Numbered list object two<li><li>Numbered list object three</li></ol></a>
nav
.nav a
.nav a:hover
.nav a:after
.nav a:focus
<div class="navbar">
<nav>
<a href="home.html">HOME</a>
<a href="about.html">ABOUT</a>
<a href="product.html">PRODUCT</a>
<a href="checkout.html">CHECKOUT</a>
<a href="contact.html">CONTACT</a>
</nav>
.grid
.grid h1
.grid h2>
<div > <src="indoor_planter.jpg" alt="indoor planter">
<h1> Indoor planter <h1>
<h2> $18 <h2>
.payment
<div class="payment">
<div class="payment-form1">
<input id="paypment_form1" type="radio" name="card" value="debit">Debit card </div>.cart-item
<div class="cart-item">
<div class="cart-left">
<h3>Cart</h3 ><hr><br>
<p><a href="#"Product 1 </a></p>
<div class="cart-right">
<h3>4</h3>
<p>4<p>
#E5E7DA
#E3DFD4
#B1BC9E
#E2E7ED
#5F6973
The main focus of the company is to bring the world minimal but unique designs of home decorations made from sustainable materials. The most popular products are indoor planters that grow in modern pots and bottles. Having a glance at green can calm your mind and remind you of all the goodness in the world.
The company targets young adults who pursue a life of quality, sentiment and style, from age 18 to 35. Since the company promotes sustainable living, the potential consumers can be individuals who care about the wellness of the earth.
The art direction is using a combination of clean colors and minimal design on the UI. The company will attract people to its unique branding idea and asthetic appeals.
