Another CSS Art from Demon Slayer

#showdev #css #html #webdev

The last CSS Art I made was so real that he start talking! He was so nervous and screaming everywhere:

"Nezuko!! Where is Nezuko?!"

Stay calm Tanjiro, Nezuko is here 👇

Another CSS-Only illustration to be added to the list of my previous ones:

CSS Art

It's on twitter if you want to spread the word 📣📣

T. Afif @ CSS Challenges

@challengescss

🎨 CSS Art

The Tanjiro I made was getting nervous and start screaming: "Nezuko!! Where is Nezuko?!"

𝗡𝗲𝘇𝘂𝗸𝗼 is here 👇

Demo: codepen.io/t_afif/full/ab… via @CodePen

✅ A CSS-Only illustration (No image, No SVG)

More at css-only.art

#CSS #CSSart #DemonSlayer twitter.com/ChallengesCss/…

11:14 AM - 28 Apr 2022

T. Afif @ CSS Challenges @ChallengesCss
🎨 CSS Art I am adding a demon slayer to the list. Take a deep breath and say hello to 𝗧𝗮𝗻𝗷𝗶𝗿𝗼 𝗞𝗮𝗺𝗮𝗱𝗼 ⚔️ Demo: https://t.co/IRUu9m3Msq via @CodePen ✅ A CSS-only illustration (No images and No SVG) Find more at https://t.co/i9XRGhP91M #CSS #cssart #DemonSlayer https://t.co/CcBoqbXKf6

Tanjiro : "Nezuko, let's go!"

Nezuko : "Hum!!"

You want to support me?

Discussion (22)

Danny Engelman • Apr 28 • Edited on Apr 28

And then add declarative shadowDOM to use all in one page, without having to subclass with constructs like .nezuko .face

<temani-nezuko>
  <template shadowroot="open">
     <style>
         ... all CSS here
     </style>
        .... all HTML here
  </template>
</temani-nezuko>

Still NO JavaScript involved... but.. it also does not create the <temani-nezuko> Web Component.

It only displays one instance.

Kamado and Nezuko: jsfiddle.net/WebComponents/1r9cbym2/