<section class="bg-wave"></section>
<section class="bg-diag-stripes"></section>
<section class="bg-carbon-fibre"></section>
<section class="bg-carbon"></section>
<section class="bg-weave"></section>

section {
  width:50%;
  float:left;
  height:300px;
}

.bg-weave {
	background:
linear-gradient(135deg, #708090 22px, #d9ecff 22px, #d9ecff 24px, transparent 24px, transparent 67px, #d9ecff 67px, #d9ecff 69px, transparent 69px),
linear-gradient(225deg, #708090 22px, #d9ecff 22px, #d9ecff 24px, transparent 24px, transparent 67px, #d9ecff 67px, #d9ecff 69px, transparent 69px)0 64px;
background-color:#708090;
background-size: 64px 128px;
}
.bg-carbon {
	background:
linear-gradient(27deg, rgb(34, 163, 223) 5px, transparent 5px) 0 5px,
linear-gradient(207deg, rgb(34, 163, 223) 5px, transparent 5px) 10px 0px,
linear-gradient(27deg, rgb(34, 163, 223) 5px, transparent 5px) 0px 10px,
linear-gradient(207deg, rgb(34, 163, 223) 5px, transparent 5px) 10px 5px,
linear-gradient(90deg, rgba(0,0,0,0.1) 10px, transparent 10px),
linear-gradient(rgb(34, 163, 223) 25%, rgb(34, 163, 223) 25%, rgb(34, 163, 223) 50%, transparent 50%, transparent 75%, rgb(34, 163, 223) 50%, rgb(34, 163, 223));
background-color:rgb(34, 163, 223);
background-size: 6px 6px;
}
.bg-carbon-fibre {
	background:
radial-gradient(black 15%, transparent 16%) 0 0,
radial-gradient(black 15%, transparent 16%) 8px 8px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
background-color:#282828;
background-size:16px 16px;
}
.bg-blueprint {
	background-color:#269;
background-image: linear-gradient(white 2px, transparent 2px),
linear-gradient(90deg, white 2px, transparent 2px),
linear-gradient(rgba(255,255,255,.3) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,.3) 1px, transparent 1px);
background-size:100px 100px, 100px 100px, 20px 20px, 20px 20px;
background-position:-2px -2px, -2px -2px, -1px -1px, -1px -1px;
}

.bg-diag-stripes {
	background-color: transparent;
background-image: repeating-linear-gradient(45deg, rgb(34, 163, 223), rgb(34, 163, 223) 35px, rgba(34, 163, 223,0.9) 75px, rgba(34, 163, 223,0.8) 70px);
}

.bg-wave {
  background: linear-gradient(#ffffff 50%, rgba(255,255,255,0) 0) 0 0,
radial-gradient(circle closest-side, #FFFFFF 53%, rgba(255,255,255,0) 0) 0 0,
radial-gradient(circle closest-side, #FFFFFF 50%, rgba(255,255,255,0) 0) 55px 0 #48B;
background-size:110px 200px;
background-repeat:repeat-x;
}