47 lines
1.0 KiB
CSS
47 lines
1.0 KiB
CSS
|
@import url('https://googleapis.com/css2?family=Nunito:wght@900&display=swap');
|
||
|
|
*
|
||
|
|
{
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
font-family: 'Nunito', sans-serif;
|
||
|
|
}
|
||
|
|
body
|
||
|
|
{
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
min-height: 100vh;
|
||
|
|
background: radial-gradient(#111,#000);
|
||
|
|
}
|
||
|
|
h2
|
||
|
|
{
|
||
|
|
position: relative;
|
||
|
|
font-size: 8em;
|
||
|
|
text-transform: uppercase;
|
||
|
|
color: transparent;
|
||
|
|
background: linear-gradient(to bottom, #222 0%, #222 50%, #111 50%, #111 100%);
|
||
|
|
-webkit-background-clip: text;
|
||
|
|
}
|
||
|
|
h2:before
|
||
|
|
{
|
||
|
|
content: attr(data-text);
|
||
|
|
position: absolute;
|
||
|
|
top: 4px;
|
||
|
|
left: 4px;
|
||
|
|
z-index: -1;
|
||
|
|
background: linear-gradient(45deg,#ff0,#0f0,#f00,#00f,#0f0);
|
||
|
|
-webkit-background-clip: text;
|
||
|
|
color: transparent;
|
||
|
|
}
|
||
|
|
h2:after
|
||
|
|
{
|
||
|
|
content: attr(data-text);
|
||
|
|
position: absolute;
|
||
|
|
top: 30px;
|
||
|
|
left: 20px;
|
||
|
|
z-index: -2;
|
||
|
|
background: linear-gradient(45deg,#ff0,#0f0,#f00,#00f,#0f0);
|
||
|
|
-webkit-background-clip: text;
|
||
|
|
color: transparent;
|
||
|
|
filter: blur(20px);
|
||
|
|
}
|