Skip to content

Instantly share code, notes, and snippets.

@Raja0sama
Created February 12, 2021 06:35
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save Raja0sama/d15ca6d363929b2f96a8f0e7ea4cbdf1 to your computer and use it in GitHub Desktop.
Save Raja0sama/d15ca6d363929b2f96a8f0e7ea4cbdf1 to your computer and use it in GitHub Desktop.
splash screen css 2
:root {
--color: #1c1821;
}
.Splash {
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
background-color: var(--color);
}
.front {
position: relative;
font-family: sans-serif;
text-transform: uppercase;
font-size: 2em;
font-weight: bold;
letter-spacing: 4px;
overflow: hidden;
}
.frontA {
background: linear-gradient(90deg, var(--color), #fff, var(--color));
background-repeat: no-repeat;
background-size: 80%;
animation: animate 3s linear infinite;
-webkit-background-clip: text;
-webkit-text-fill-color: rgba(255, 255, 255, 0);
}
@keyframes animate {
0% {
background-position: -500%;
}
100% {
background-position: 500%;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment