Text Glow

Soft glows for text. Unfortunately glows are difficult to construct using only utility classes, so these are more hard-coded than other elements. You can adjust glow colors and some other variables within _evo_variables.scss.

text-glow

glow

<h1 class="text-glow">glow</h1>

Create a container for your text such as a <p> tag or <h1> tag, and apply the text-glow class. Global style is defined in _evo_variables.scss

glow

<h1 class="text-glow-inverse">glow</h1>

On dark backgrounds, apply the text-glow-inverse class for a light colored glow. Global style is defined in _evo_variables.scss

text-glow-[thickness]

glow

<h1 class="text-glow-thin">glow</h1>

glow

<h1 class="text-glow-medium">glow</h1>

glow

<h1 class="text-glow-thick">glow</h1>

Create a container for your text such as a <p> tag or <h1> tag, and apply the text-glow class. Global style is defined in _evo_variables.scss

glow

<h1 class="text-glow-thin-inverse">glow</h1>

glow

<h1 class="text-glow-medium-inverse">glow</h1>

glow

<h1 class="text-glow-thick-inverse">glow</h1>

On dark backgrounds, apply the text-glow-inverse class for a light colored glow. Global style is defined in _evo_variables.scss

text-glow-[number]

text-glow-1

glow

text-glow-2

glow

text-glow-3

glow

text-glow-4

glow

text-glow-5

glow

text-glow-6

glow

text-glow-7

glow

text-glow-8

glow

text-glow-9

glow

text-glow-10

glow

text-glow-11

glow

text-glow-12

glow

text-glow-13

glow

text-glow-14

glow

text-glow-15

glow

text-glow-16

glow

text-glow-17

glow

text-glow-18

glow

text-glow-19

glow

text-glow-20

glow

<h1 class="text-glow-20">glow</h1>

Create a container for your text such as a <p> tag or <h1> tag, and apply a text-glow-[number] class such as text-glow-20. Global style is defined in _evo_variables.scss

inverse-text-glow-[number]

inverse-text-glow-1

glow

inverse-text-glow-2

glow

inverse-text-glow-3

glow

inverse-text-glow-4

glow

inverse-text-glow-5

glow

inverse-text-glow-6

glow

inverse-text-glow-7

glow

inverse-text-glow-8

glow

inverse-text-glow-9

glow

inverse-text-glow-10

glow

inverse-text-glow-11

glow

inverse-text-glow-12

glow

inverse-text-glow-13

glow

inverse-text-glow-14

glow

inverse-text-glow-15

glow

inverse-text-glow-16

glow

inverse-text-glow-17

glow

inverse-text-glow-18

glow

inverse-text-glow-19

glow

inverse-text-glow-20

glow

<h1 class="inverse-text-glow-20">glow</h1>

Create a container for your text such as a <p> tag or <h1> tag, and apply an inverse-text-glow-[number] class such as inverse-text-glow-20. Global style is defined in _evo_variables.scss