Style Guide Template

A template you can use to start building out your own style guides with.

Interactive Elements

In-text link

Discover the best Thai Foods in Surrey

Navigation Link

CSS selector:

.button-nav

Sample code:

<a href="#" class="button">Default Button</a>

Rendered element:

Default Button

Text Input Field with Label

Image as a Link

Thai food

Text Elements

Headings

Heading 3

Heading 4

Heading 5
Heading 6

Paragraphs

  1. This company aims to deliver the very best thai food, to thai food lovers all over vancouver and burnaby. The app gives users the ability to find the nearest thai food restaurants while also providing reviews from fellow users on each restaurant. The app also provides information regarding thai food as well as giving out recipes and instructions on making thai food at home

  2. The company can be contacted through the website itself. Users can chat with the staff through a pop up chat box. Or they can also call in for additional information

  3. Users first browse through the list of restaurants. After selecting the restaurant they can then select the menu item. They can then pay using their card and simply wait for delivery.

Numbered Lists

  1. Pad Thai
  2. Thai Green Curry
  3. Stir Fried Crab in Curry Powder
  4. Steamed Seabass with lime and chillies
  5. Thai Fried Rice

Combined Elements

Main Navigation

Product/Service Listing

Provide delivery all over burnaby

Users are able to order thai food online wherever they are in vacouver discovering their favorite thai classics.

Food Delivery

Get reviews from fellow users and their favourite spots

Users are able to read customer reviews about the restaurant giving them an idea of what would best suit their tastes

Food Review

Introduces users to new thai cuisines

Users can find out more about Thai cuisines that they have yet to try, as well as where to find them

Thai Cuisine

Color Pallette for Website

These are the colors I plan to use, which I feel are represented of thai colors

Colors

Citations