CSS box-shadow to Layer Style

⚠️ This plugin is no longer maintained. Feel free to download as is.

Easily convert CSS box-shadows to Sketch Layer styles. Inset box-shadows are also suppported.

Inspired by Philipp Brumm’s tool brumm.af/shadows. Feel free to copy a box shadow from his tool and enter it in sketch.

Demo Box-Shadow

Try the plugin for yourself with the following demo box-shadow:

box-shadow: inset 0 2 1 rgba(255,255,255,0.75), 0 2.1px 2.2px -2px rgba(0, 0, 0, 0.13), 0 5.8px 6.1px -2px rgba(0, 0, 0, 0.139), 0 13.9px 14.8px -2px rgba(0, 0, 0, 0.142), 0 46px 49px -2px rgba(0, 0, 0, 0.15);

Installation

• Download the latest release of the plugin
• Un-zip
• Double-click on css-to-shadow-style.sketchplugin