Be Proud of Who You Are!

be-proud-of-who-you-are.markdown

Be Proud of Who You Are!

Love is love, it is not hard to understand.

A Pen by Gabriel Cyrillo on CodePen.

License.

index.pug

h1 #PrideMonth❤

style.css

body{
	overflow: hidden;
}

h1 {
	font-family: 'Bowlby One SC', cursive;
	font-size: 10vw;
	width: 100vw;
	margin-top: calc(50vh - 10vw);
	text-align: center;
	background: linear-gradient(
		60deg,
		hsl(0, 75%, 50%) 10%,
		hsl(20, 75%, 50%) 10%,
		hsl(20, 75%, 50%) 25%,
		hsl(50, 75%, 50%) 25%,
		hsl(50, 75%, 50%) 40%,
		hsl(130, 75%, 50%) 40%,
		hsl(130, 75%, 50%) 55%,
		hsl(200, 75%, 50%) 55%,
		hsl(200, 75%, 50%) 70%,
		hsl(260, 75%, 50%) 70%,
		hsl(260, 75%, 50%) 85%,
		hsl(0, 75%, 50%) 85%
	);

	text-shadow: 0.5px -0.6vw #fff4;
	color: #fff;
	-webkit-background-clip: text;
   	-webkit-text-fill-color: transparent;
   	animation: 10s BeProud linear infinite,
   	3s Always ease alternate infinite;
}

@keyframes BeProud {
	100% { background-position: 100vw 0px; }
}

@keyframes Always {
	100% { transform: scale(1.1);}
}

styles

<link href="https://fonts.googleapis.com/css?family=Bowlby+One+SC" rel="stylesheet" />