См. Эту статью: http://lea.verou.me/css3patterns/#honeycomb
Демонстрация, чтобы сделать это будущее, в случае, если ссылка будет отключена:
body {
width: 100%;
height: 100%;
background:
radial-gradient(circle farthest-side at 0% 50%,#fb1 23.5%,rgba(240,166,17,0) 0)21px 30px,
radial-gradient(circle farthest-side at 0% 50%,#B71 24%,rgba(240,166,17,0) 0)19px 30px,
linear-gradient(#fb1 14%,rgba(240,166,17,0) 0, rgba(240,166,17,0) 85%,#fb1 0)0 0,
linear-gradient(150deg,#fb1 24%,#B71 0,#B71 26%,rgba(240,166,17,0) 0,rgba(240,166,17,0) 74%,#B71 0,#B71 76%,#fb1 0)0 0,
linear-gradient(30deg,#fb1 24%,#B71 0,#B71 26%,rgba(240,166,17,0) 0,rgba(240,166,17,0) 74%,#B71 0,#B71 76%,#fb1 0)0 0,
linear-gradient(90deg,#B71 2%,#fb1 0,#fb1 98%,#B71 0%)0 0 #fb1;
background-size:40px 60px;
}
Вот версия SCSS (https://jsfiddle.net/ajnd782w/):
$primary-color: #fb1;
$line-color: #B71;
$transparent: transparent;
$size: 30px;
body {
width: 100%;
height: 100%;
background:
radial-gradient(circle farthest-side at 0% 50%,$primary-color 23.5%,$transparent 0)($size * .7) $size,
radial-gradient(circle farthest-side at 0% 50%,$line-color 24%,$transparent 0)($size * .6129) $size,
linear-gradient($primary-color 14%,$transparent 0, $transparent 85%,$primary-color 0)0 0,
linear-gradient(150deg,$primary-color 24%,$line-color 0,$line-color 26%,$transparent 0,$transparent 74%,$line-color 0,$line-color 76%,$primary-color 0)0 0,
linear-gradient(30deg,$primary-color 24%,$line-color 0,$line-color 26%,$transparent 0,$transparent 74%,$line-color 0,$line-color 76%,$primary-color 0)0 0,
linear-gradient(90deg,$line-color 2%,$primary-color 0,$primary-color 98%,$line-color 0%)0 0 $primary-color;
background-size:($size * 1.333) ($size * 2);
}
Никогда не сдавайся.:)