<div class="patterns">
	<svg width="100%" height="100%">
		<defs>
			<pattern id="polka-dots" x="0" y="0" width="100" height="100" patternUnits="userSpaceOnUse">
				<circle fill="#bee9e8" cx="50" cy="50" r="25" />
			</pattern>
		</defs>

		<rect x="0" y="0" width="100%" height="100%" fill="url(#polka-dots)" />
	</svg>
</div>
.patterns {
	background-color: #2e4057;
	height: 100vh;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.