Eleftheria BatsouProeleftheriabatsou.hashnode.dev·Dec 22, 2023CSS Art Tutorial: Creating a Christmas Scene (and Animating the Mountains and the Tree) 🎄❄️Introduction In this article, I'll show you how to create a Christmas scene with snowy mountains, a tree, a little home and a cute human with SCSS+HTML! Tools and resources: I'm using codepen. Clippy You'll learn: How to create different shapes ...Discuss·35 likes·97 reads🖱CSS Art and small HTML/CSS/JS projects [Codepen]CSS
Eleftheria BatsouProeleftheriabatsou.hashnode.dev·Nov 27, 2023CSS Art Tutorial: Creating a simple Santa Claus (and animate the snowflakes) 🎅❄️Introduction In this article, I'll show you how to create Santa Claus and snowflakes with CSS+HTML. We're going to use a few classes, some pseudo-classes, and in the end we'll add some animation to the snowflakes! https://www.youtube.com/watch?v=4Bha...Discuss·18 likes·610 reads🖱CSS Art and small HTML/CSS/JS projects [Codepen]CSS
Maciek Fitznermackfitz.hashnode.dev·Aug 16, 2023FeaturedParticles & spiral patterns in CSS: part IVThe Archimedean - that we talked about in part 3 - isn't the only type of concentric spiral. It's the OG, having been described by Archimedes ca. 225 BC. The next big thing didn't come for almost 2000 years. But in reality, it had always been there, ...Discuss·14 likes·244 readsParticles & spiral patternsspiral
Maciek Fitznermackfitz.hashnode.dev·Aug 9, 2023Particles & spiral patterns in CSS: part IIIIf you thought my obsession with particles and curves waned over the past two weeks since the last post, then I'm here to disappoint you. In Part 1 and Part 2 I covered linear and circular serpentine patterns. But for me where it's really at is spira...Discuss·155 readsParticles & spiral patternsCSS
Maciek Fitznermackfitz.hashnode.dev·Jul 24, 2023Particles & spiral patterns in CSS: part IIThe week of Codepen's particle challenge is up - but I'm far from done obsessing over particles and serpentines. In Friday's Part I I merely scratched the surface, showing you my first demo for this week's challenge: https://codepen.io/MackFitz/pen/R...Discuss·81 readsParticles & spiral patternsCSS
Alvaro Montoroalvaromontoro.hashnode.dev·May 15, 2023CSS Art: Drawing a Coffee StainA few weeks ago, I did some CSS Art. This time it was a cup of coffee with a coffee ring stain next to it. All in HTML and CSS –and not as many elements as you'd think... if we don't count the bubbles. I tried to make it realistic but it was too cart...Discuss·1 like·1.5K readsCSS
Alvaro Montoroalvaromontoro.hashnode.dev·Apr 8, 2023Drawing an Egg with CSSDrawing an egg with CSS is simpler than many people imagine. So simple that you can do it with just two properties: .egg { aspect-ratio: 3 / 4; border-radius: 100% / 125% 125% 80% 80%; } Yes. That’s it! Apply that to a block element, and it will...Discuss·3 likes·73 readsCSS
JR.Pranavjrpranav.hashnode.dev·Apr 5, 2023#Day 1 : CSS ArtJuicy Watermelon Juicy Watermelon will "Quench your thirst for creativity with this delightful Watermelon drawing made entirely with HTML and CSS! Watch as the vibrant shades of green and dark pink come to life on your screen, bringing a touch of su...Discuss·2 likes·52 readsCSS
Eleftheria BatsouProeleftheriabatsou.hashnode.dev·Mar 23, 2023Getting Started with CSS Animations: Creating Engaging Web AnimationsWelcome to the world of web development, where the only thing constant is change. And one of the biggest changes we've seen in recent years is the increasing use of CSS animations. No longer are websites static, boring pages of information. Now, they...Discuss·31 likes·306 reads🖱CSS Art and small HTML/CSS/JS projects [Codepen]CSS
Alvaro Montoroalvaromontoro.hashnode.dev·Mar 15, 2023CSS Art: Motorola RAZR V3Ok, maybe the RAZR is not the best flip phone ever, but it was iconic - and I say that not only because I had one. It was one of the most popular cell phones in the mid-2000s. The other day, the kids went to sleep early, and I decided to do some CSS ...Discuss·1 like·51 readsCSS