oliverpitsch / CSS-Shadow-to-Sketch-Style-Plugin

A Sketch Plugin that converts a CSS box-shadow into a layer style.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

CSS box-shadow to Layer Style

Repository Image

⚠️ 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

About

A Sketch Plugin that converts a CSS box-shadow into a layer style.


Languages

Language:JavaScript 100.0%