STARTUP TEMPLATES.

This CSS (Cascading Style Sheet) startup template is the time to save time. We also know that CSS has not actually a startup template but when you start a new web HTML project you use CSS and you use some standard properties like margin and padding, text decoration, etc. So with the help of this starter, you can save your time as there are many common properties pre-written and you can copy and paste them.

CSS3 SIMPLE STARTUP.

You can use this starter template to save time because this starter has some common properties that everyone uses in the starting of CSS.

CSS

* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-family: sans-serif;
  scroll-behavior: smooth;
}

a {
  text-decoration: none;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

a:hover,
a:focus {
  text-decoration: none;
  outline: none;
}

li {
  list-style-type: none;
}

li:hover,
li:focus {
  list-style-type: none;
}

button:focus {
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}

CSS3 ADVANCED STARTUP:-

The best way to get started is in CSS. It is the best boiler template of CSS which has the maximum properties that you need and that you have to write.

CSS

/* Poppin Google Font Link */
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400&display=swap");

* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-family: 'Poppins', sans-serif;
}

*::before {
  -webkit-box-sizing: inherit;
          box-sizing: inherit;
}

*::after {
  -webkit-box-sizing: inherit;
          box-sizing: inherit;
}

body {
  background: #1a2e38;
}

html,
body {
  /* Adjust font size */
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  /* Font varient */
  font-variant-ligatures: none;
  -webkit-font-variant-ligatures: none;
  /* Smoothing */
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  scroll-behavior: smooth;
  text-shadow: rgba(0, 0, 0, 0.01) 0 0 1px;
}

a {
  text-decoration: none;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

a:hover, a:focus {
  text-decoration: none;
  outline: none;
}

ul {
  list-style: none;
}

ul:hover, ul:focus {
  list-style: none;
}

li {
  list-style-type: none;
}

li:hover, li:focus {
  list-style-type: none;
}

button:focus {
  outline: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

:root {
  --color1: #002347 !important;
  --color2: #fdc632 !important;
  --white: #ffffff !important;
  --black: #000000 !important;
  --light: #ebe5e9 !important;
  --dark: #474747 !important;
}

/* Use these statements, if you want to call colors anywhere.
    var(--color1)
    var(--color2)
    var(--white)
    var(--black)
    var(--light)
    var(--dark) */