Kasia

This is a continuation of an article about generating snowflakes with plain javascript. In the first part we went through the process of creating a desired snowflake with SVG and ended up with a static result representing an example snowflake. Today we’ll write some javascript to make creating snowflakes interactive. As a reminder, here are […]

Since I saw this year’s first snow last week I keep thinking about snowflakes. How they are symmetrical, complex and unique at the same time and most importantly – beautiful. Today I’ll try to recreate some of those properties with SVG and in the second part we’ll make generation interactive with javascript. Getting started First […]

Styling websites sometimes requires more boxes than semantic HTML delivers. To go around this problem we can either put some divs or spans in our markup and style them or use pseudo-elements like ::before and ::after. Using real elements (spans and divs), that are in the DOM structure, has an advantage of being javascript-friendly. We […]

It’s time for part 2 – grouping and transforming SVG paths. A short reminder: in first part I have showed you how to create simple SVG shapes if you have a raster image. We went through some of the path syntax mysteries and ended up with all the simple shapes ready to merge into letters. […]

Yesterday I watched a trailer for the new James Bond movie – “No time to die” and I loved the animation at the end, so I decided to recreate it with web technologies. In this part one I will show you how to reproduce this kind of SVG shapes. Let’s go! Assumptions Original image we’ll […]