Inline SVG backgrounds in CSS

• Use single quotes for SVG attributes.
• Use %23 for #.
• Use %3c for <.
• Use %3e for >.

Example Path

background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");

Example Polygon

&::after {
	background-image: url("data:image/svg+xml,%3csvg width='48' height='48' viewBox='0 0 48 48' xmlns='http://www.w3.org/2000/svg'%3e%3cpolygon points='28.05 36.05 25.9 33.95 34.3 25.55 8 25.55 8 22.55 34.3 22.55 25.85 14.1 28 12 40.05 24.05' fill='%23ffffff'/%3e%3c/svg%3e");
	background-size: 24px 24px;
	width: 24px;
	height: 24px;
}