<div class="min-h-screen flex flex-col justify-center items-center gap-16">

	<div class="flex items-center gap-16">
		<div class="text-2xl text-gray-600 font-medium tracking-wider">
			Fill is blank:
		</div>
		<svg viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="w-12 h-auto">
			<g id="Page-1" stroke="none" stroke-width="1" fill="" fill-rule="evenodd">
				<g id="icon-shape">
					<polygon id="Path-126" points="0 11 2 9 7 14 18 3 20 5 7 18"></polygon>
				</g>
			</g>
		</svg>
		<svg viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="w-12 h-auto">
			<g id="Page-1" stroke="none" stroke-width="1" fill="" fill-rule="evenodd">
				<g id="icon-shape">
					<polygon id="Combined-Shape" points="10 8.58578644 2.92893219 1.51471863 1.51471863 2.92893219 8.58578644 10 1.51471863 17.0710678 2.92893219 18.4852814 10 11.4142136 17.0710678 18.4852814 18.4852814 17.0710678 11.4142136 10 18.4852814 2.92893219 17.0710678 1.51471863 10 8.58578644"></polygon>
				</g>
			</g>
		</svg>
	</div>
	<div class="flex items-center gap-16">
		<div class="text-2xl text-gray-600 font-medium tracking-wider">
			Fill current:
		</div>
		<svg viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="w-12 h-auto fill-current text-green-400">
			<g id="Page-1" stroke="none" stroke-width="1" fill="" fill-rule="evenodd">
				<g id="icon-shape">
					<polygon id="Path-126" points="0 11 2 9 7 14 18 3 20 5 7 18"></polygon>
				</g>
			</g>
		</svg>
		<svg viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="w-12 h-auto fill-current text-red-400">
			<g id="Page-1" stroke="none" stroke-width="1" fill="" fill-rule="evenodd">
				<g id="icon-shape">
					<polygon id="Combined-Shape" points="10 8.58578644 2.92893219 1.51471863 1.51471863 2.92893219 8.58578644 10 1.51471863 17.0710678 2.92893219 18.4852814 10 11.4142136 17.0710678 18.4852814 18.4852814 17.0710678 11.4142136 10 18.4852814 2.92893219 17.0710678 1.51471863 10 8.58578644"></polygon>
				</g>
			</g>
		</svg>
	</div>
</div>

External CSS

  1. https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.0.2/tailwind.min.css

External JavaScript

This Pen doesn't use any external JavaScript resources.