From 4de65e2e1ea2fba9c55e5db73fe0dcc8d31ea945 Mon Sep 17 00:00:00 2001 From: Prince Kumar Date: Sat, 8 Oct 2022 15:18:59 +0530 Subject: [PATCH] add new CSS_ANIMATION --- CSS_BEST_ANIMATION/index.css | 26 ++++++++++++++++++++++++++ CSS_BEST_ANIMATION/index.html | 15 +++++++++++++++ 2 files changed, 41 insertions(+) create mode 100644 CSS_BEST_ANIMATION/index.css create mode 100644 CSS_BEST_ANIMATION/index.html diff --git a/CSS_BEST_ANIMATION/index.css b/CSS_BEST_ANIMATION/index.css new file mode 100644 index 0000000..a740c27 --- /dev/null +++ b/CSS_BEST_ANIMATION/index.css @@ -0,0 +1,26 @@ +@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500&display=swap'); +.container-text { + display: flex; + justify-content: center; + align-items: center; + width: 100%; + height: 100vh; +} + +h1 { + text-transform: uppercase; + background-image: linear-gradient(to right top, #ffff34, #ffc812, #ff8f2f, #ff554d, #eb1267); + background-size: 50% auto; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + font-family: 'Poppins', sans-serif; + font-size: 8vw; + animation: gradientAnim 7.5s ease alternate infinite; +} + + +@keyframes gradientAnim { + to { + background-position: 100% top; + } +} \ No newline at end of file diff --git a/CSS_BEST_ANIMATION/index.html b/CSS_BEST_ANIMATION/index.html new file mode 100644 index 0000000..032982f --- /dev/null +++ b/CSS_BEST_ANIMATION/index.html @@ -0,0 +1,15 @@ + + + + + + + CSS ANIMATION + + + +
+

Hello World

+
+ + \ No newline at end of file