featured ebook
Tai & The Keys Of Trust
Discovering The Update Framework

Tai & The Keys of Trust is an illustrated adventure that introduces The Update Framework (TUF) through a fun story about trust, keys, roles, and approvals.

Also included: the Everyday Inkscape Creator Kit with editable templates and practical creation resources.
…
With every purchase,
we'll put real $ toward Inkscape.
You're helping us support the amazing open-source tools that unlock unlimited creative power for everyone.
Digital Ebook
Instant Access
Created With Inkscape

Accelerate your journey

Our digital downloads offer a wide range of tools, tutorials, and guides across multiple fields, from web design to productivity hacks and creative resources. Each item is carefully crafted to ensure a perfect balance of quality, clarity, and innovation, helping you focus on what matters—creating, learning, and succeeding.

css funstuff

CSS Funstuff - Cards (Header)
1 / 2

css funstuff: cards

Create stylish, customizable cards using pure HTML and CSS.

read dev article

css funstuff - cards •••••

Cards are one of those things that seem simple until you start playing with them. This set takes the basic UI card and has a little more fun with it, using pseudo-elements to move the background independently of the content. That means you can rotate it, scale it, shift the colour around, and generally make things more interesting without sending the text along for the ride.

The download includes the examples from the article, along with some extra variations you can pull apart, tweak, or use as a starting point for something of your own.

It’s useful if you want a card design that feels a bit less generic, or if you just want a practical example of how pseudo-elements can do more than sit behind a heading or add a decorative flourish. Sometimes the quickest way to get comfortable with a technique is to see it doing something you’d actually want to use.

CSS Funstuff - Animated Halfway Borders (Header)
1 / 2

css funstuff: animated halfway borders

Create animated borders that grow smoothly from the halfway point using pure CSS.

read dev article

css funstuff - animated halfway borders •••••

Sometimes one tiny CSS change is enough to make something unexpectedly fun. In this case, adding border-radius to a border on just one side of an element gives you a curved “halfway” border. Animate it, and suddenly there’s a lot more to play with.

The download gives you the source from the tutorial, ready for you to change the shape, speed, colour, timing, or just see what else you can get out of the idea.

It’s a small effect, but that’s part of the appeal. You can drop it onto a button, link, heading, or other UI element without rebuilding half your interface around it. It’s the kind of detail that can make something feel more deliberate without making the design noisy.

CSS Funstuff - Animated Waveforms (Header)
1 / 2

css funstuff: animated waveforms

Build and customize your own animated waveform visualizer using pure CSS.

read dev article

css funstuff - animated waveforms •••••

How much of a waveform can you fake with plain old CSS? Turns out, quite a bit. A handful of divs, Flexbox, keyframes, and a few custom properties are enough to get the bars moving at different speeds and create the effect.

The full project takes it a little further with a slider and some JavaScript so you can change the animation speed on the fly. Grab the source, mess with the timing, add more bars, or see what else you can make it do.

It’s also a nice example of several small web techniques working together without becoming a giant project. If you’ve wanted to get a better feel for animation timing, CSS variables, or how CSS and a little JavaScript can interact, this gives you something visual and immediate to experiment with rather than another abstract demo.

Your cart is empty

Items you add will appear here.

store