Knowledge Library
Print

Rainbow Font CSS

/* rainbow text blue to green to yellow */
.rainbow-txt-bl-grn-yl {
background-color: #f3ec78;
background-image: linear-gradient(90deg, #01aafa, #fed548);
background-size: 100%;
-webkit-background-clip: text;
-moz-background-clip: text;
-webkit-text-fill-color: transparent;
-moz-text-fill-color: transparent;
}

/* rainbow text purple to green to orange */
.rainbow-txt-pp-grn-orng {
background: #CD237C;
background: -webkit-linear-gradient(to right, #CD237C 0%, #7E1083 28%, #44D1BB 60%, #FEAB43 100%);
background: -moz-linear-gradient(to right, #CD237C 0%, #7E1083 28%, #44D1BB 60%, #FEAB43 100%);
background: linear-gradient(to right, #CD237C 0%, #7E1083 28%, #44D1BB 60%, #FEAB43 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

/* rainbow text purple to green to orange v2 */
.rainbow-txt-pp-grn-orngv2 {
background: #7E1083;
background: -webkit-linear-gradient(to right, #7E1083 0%, #A21477 19%, #44D1BB 65%, #FEAB43 100%);
background: -moz-linear-gradient(to right, #7E1083 0%, #A21477 19%, #44D1BB 65%, #FEAB43 100%);
background: linear-gradient(to right, #7E1083 0%, #A21477 19%, #44D1BB 65%, #FEAB43 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

Table of Contents

If you're looking for a systematic way to grow your services business without overwhelm, frustration or trying to google every answer, then you need this simple 3 step framework.

Get Free training Plus The 3 step Framework MAP PDF

Marketing Maps PDF and Training

We will not spam share your information ever!