# Slicing SVG 9 Ways

DevFeed: [Slicing SVG 9 Ways](<https://devfeed.tech/articles/slicing-svg-9-ways-39439.md>)

Original publisher: [Read original article](<https://aerotwist.com/blog/slicing-svg-9-ways>)

Author: Paul Lewis

Published: 2016-08-30T00:00:00Z

Content type: tutorial

Language: en

Sources: [Paul Lewis](<https://devfeed.tech/sources/paul-lewis.md>)

Topics: [SVG](<https://devfeed.tech/topics/svg.md>), [CSS](<https://devfeed.tech/topics/css.md>), [SVG animations in CSS](<https://devfeed.tech/topics/svg-animations-in-css.md>), [Web Development](<https://devfeed.tech/topics/web-development.md>)

Tags: [3d](<https://devfeed.tech/tags/3d.md>), [challenges](<https://devfeed.tech/tags/challenges.md>), [css](<https://devfeed.tech/tags/css.md>), [explain](<https://devfeed.tech/tags/explain.md>), [gpu](<https://devfeed.tech/tags/gpu.md>), [performance](<https://devfeed.tech/tags/performance.md>), [responsive](<https://devfeed.tech/tags/responsive.md>), [series](<https://devfeed.tech/tags/series.md>), [svg](<https://devfeed.tech/tags/svg.md>), [video](<https://devfeed.tech/tags/video.md>), [youtube](<https://devfeed.tech/tags/youtube.md>)

## AI overview

This tutorial explains how to approach dynamically sized shadows for a 3D card flip in responsive web design. It compares CSS box-shadow and blur filters, focusing on editability, animation performance, and rendering costs.

## Source excerpt

I recently made a 3D Card Flip element as part of my Supercharged YouTube video series, and I ran into some challenges with the shadows. I decided I should explain how I approached the solution.