Landing Page - JUMPERS

landing-page-DARK-PR_Html-css-back-DARK-PR_mockup_Model-w-Background_Male_Black.png
landing-page-DARK-PR_Html-css-back-DARK-PR_mockup_Flat-Back_Black.png
landing-page-DARK-PR_Html-css-back-DARK-PR_mockup_Flat-Back_Navy.png
landing-page-DARK-PR_Html-css-back-DARK-PR_mockup_Flat-Front-2_Black.png
landing-page-DARK-PR_Html-css-back-DARK-PR_mockup_Flat-Front-2_Navy.png
landing-page-DARK-PR_Html-css-back-DARK-PR_mockup_Model-w-Background_Male_Navy.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Flat-Back_Heather-Grey.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Flat-Back_White.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Flat-Front-2_Heather-Grey.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Flat-Front-2_White.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Model-w-Background_Male_Heather-Grey.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Model-w-Background_Male_White.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Flat-Back_Asphalt.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Flat-Back_Black.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Flat-Back_Navy.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Flat-Front_Asphalt.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Flat-Front_Black.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Flat-Front_Navy.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Model-w-Background_Male_Asphalt.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Model-w-Background_Male_Black.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Model-w-Background_Male_Navy.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Flat-Back_White.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Flat-Front_White.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Model-w-Background_Male_White.png
landing-page-DARK-PR_Html-css-back-DARK-PR_mockup_Model-w-Background_Male_Black.png
landing-page-DARK-PR_Html-css-back-DARK-PR_mockup_Flat-Back_Black.png
landing-page-DARK-PR_Html-css-back-DARK-PR_mockup_Flat-Back_Navy.png
landing-page-DARK-PR_Html-css-back-DARK-PR_mockup_Flat-Front-2_Black.png
landing-page-DARK-PR_Html-css-back-DARK-PR_mockup_Flat-Front-2_Navy.png
landing-page-DARK-PR_Html-css-back-DARK-PR_mockup_Model-w-Background_Male_Navy.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Flat-Back_Heather-Grey.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Flat-Back_White.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Flat-Front-2_Heather-Grey.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Flat-Front-2_White.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Model-w-Background_Male_Heather-Grey.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Model-w-Background_Male_White.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Flat-Back_Asphalt.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Flat-Back_Black.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Flat-Back_Navy.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Flat-Front_Asphalt.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Flat-Front_Black.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Flat-Front_Navy.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Model-w-Background_Male_Asphalt.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Model-w-Background_Male_Black.png
landing-page-DARK-PR_Html-css-back-hoodie-DArk-PR_mockup_Model-w-Background_Male_Navy.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Flat-Back_White.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Flat-Front_White.png
landing-page-LIGHT-PR_Html-css-back-LIGHT-PR_mockup_Model-w-Background_Male_White.png

Landing Page - JUMPERS

99.00

An out-of-the-box landing page in html and css!

CODE:

HTML:

<!DOCTYPE html>
<html>
<head>
  <title>Epic Splash Page</title>
  <link href='https://fonts.googleapis.com/css?family=Playfair+Display:900|Raleway:300' rel='stylesheet' type='text/css'>
  <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class="container">
  <h1>My startup</h1>
  <a class="btn" href="#">SIGN UP NOW</a>
</div>
</body>
</html>

CSS:

* {
  margin: 0;
  padding: 0;
}

html, body {
  height: 100%;
  width: 100%;
}

body {
  align-items: center;
  background-color: #FFF;
  display: flex;
  font-family: 'Raleway', sans-serif;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
}

div.container {
  align-items: center;
  align-self: center;
  background: url('https://s3.amazonaws.com/codecademy-content/courses/web-101/unit-1/01/background.jpg') center center;
  border-radius: 100%;
  display: flex;
  flex-direction: column;
  min-height: 800px;
  justify-content: center;
  width: 800px;
}

h1 {
  color: #fff;
  font-family: 'Playfair Display', serif;
  font-size: 52px;
  font-weight: 900;
  line-height: 46px;
  margin: 0 0 60px 0;
  text-align: center;
  text-shadow: 0px 2px 4px rgba(34,62,66,.75);
  width: 50%;
}

a.btn {
  background: linear-gradient(45deg, rgba(255,184,115,0.65) 0%,rgba(255,124,189,0.65) 50%,rgba(108,0,153,0.65) 100%);
  border-radius: 2px;
  box-shadow: 0px 2px 4px rgba(34,62,66,.25);
  color: #fff;
  font-size: 18px;
  letter-spacing: 1px;
  padding: 16px 32px;
  text-decoration: none;
  text-transform: uppercase;
  -webkit-transition: box-shadow 1s ease;
  transition: box-shadow 1s ease;
}

a.btn:hover {
  box-shadow: 0px 4px 4px rgba(34,62,66,.5);
  -webkit-transition: box-shadow 1s ease;
  transition: box-shadow 1s ease;
}

 

COLOUR:
SIZE:
ITEM:
Quantity:
Add To Cart

All Syntaxd products are printed and shipped world-wide from a state-of-the-art facility in California, USA. 

We use super-high res printing files to ensure graphics are super crisp and clean!

Our ultra-premium sweaters feature the following for ultimate comfort: 

  • 100% California fleece cotton (Heather Grey contains 10% Polyester)

  • Raglan sleeves

  • Fabric weight 7.2 oz/yd2

  • Crew neckline

Our crew-necked sweater is made out of California fleece which, opposed to typical synthetic fleece, is made out of 100% extra soft ring-spun combed cotton (Heather Grey contains 10% Polyester). It's pre-washed to minimize shrinkage and is breathable yet extra thick for warmth.


Our ultra-premium hoodies feature the following for ultimate comfort: 

  • 100% California fleece cotton

  • Hooded with matching finished polyester drawcord

  • Raglan sleeves

  • Kangaroo pocket

  • Fabric weight 7.2 oz/yd2

  • Made in California

Our hoodies are made out of California fleece which, opposed to typical synthetic fleece, is made of 100% extra soft ring-spun combed cotton. It's pre-washed to minimize shrinkage, and is breathable yet extra thick for warmth.