---
title: "Discussion on \"CSS Loading Animation - Morphing Icons Effect (clip-path, @keyframes)\" | Hashnode"
description: "Discussion on \"CSS Loading Animation - Morphing Icons Effect (clip-path, @keyframes)\". Today let's get creative by building a morphing loading animation with icons having only 8 points and a few lines of CSS. \nRead the full article or watch me code this on Youtube:\nhttps://www.youtube.com/watch?v=M513LHCRluk\nResult\nhttps://codepen.io/c..."
url: "https://hashnode.com/posts/morphing-icons-loader/5ff5d1c0e8e57e1374e6a9e2"
---

[Feed](https://hashnode.com/feed) /

Discussion

# [CSS Loading Animation - Morphing Icons Effect (clip-path, @keyframes)](https://crayoncode.hashnode.dev/morphing-icons-loader?utm_source=hashnode&utm_medium=feed)

Today let's get creative by building a morphing loading animation with icons having only 8 points and a few lines of CSS. Read the full article or watch me code this on Youtube: https://www.youtube.com/watch?v=M513LHCRluk Result https://codepen.io/c...

Jan 6, 2021 · 5 min read · crayoncode.hashnode.dev  
Read the article

-   [#web-development](https://hashnode.com/tag/web-development)
-   [#css](https://hashnode.com/tag/css)
-   [#css3](https://hashnode.com/tag/css3)
-   [#css-animation](https://hashnode.com/tag/css-animation)
-   [#ui](https://hashnode.com/tag/ui)

## Written by

[crayon code](https://hashnode.com/@crayoncode)

@crayoncode

  
[View profile](https://hashnode.com/@crayoncode)

Web Application Architect

I'm a software architect for web applications working mostly with Node.js, Vue.js and inevitably also with HTML, (S)CSS and many other technologies that connect to it.

## Responses

Markdown supported · ⌘↵ to post

No responses yet.