Lorco is a CLI tool which extract colors from a Sketch Library file to variables in many formats including Sass, Less, CSS, JSON, JavaScript.
npm install --save lorco
const lorco = require('lorco');
// Async/await
const getColor = async () => {
const colors = await lorco('example.sketch', 'scss', 'hex');
return colors;
};
// Promise
const colors = lorco('example.sketch', 'scss', 'hex')
.then((color) => colors);
npm install -g lorco
lorco -s example.sketch -l css [-d example.css, -c hex]
Or With npx:
npx lorco -s example.sketch -l css [-d example.css, -c hex]
lorco
function takes three parameters:
param | type | default value | description |
---|---|---|---|
file | string | - | Path to the Sketch file. |
language | 'scss' , 'css' , 'less' , 'js' , 'json' | 'scss' | output target language. |
colorOutput | 'rgba' , 'rgb' , 'hex' | rgba | output color format |
You can change the behaviour of Lorco with several command line arguments.
To get list of all available commands, run lorco --help
~> lorco --help
Usage: lorco -s example.sketch -l css [-d example.css, -c hex]
Options:
-s, --source <sketch-file> indicate the source sketch file.
-l, --language <one of [css, js, json, scss, less]> indicate the language you want to build, default: Scss.
-d, --destination <destination-file> indicate the destination of generated file.
-c, --color <one of [hex, rgb, rgba]> indicate output color format, default: rgba.
-h, --help output usage information
Sketch Library file should be made of named symbols containing a shape fill with color.
You can find An example of file here
Tests are in test
directory, and are writter with Ava
Tests can be running with npm run test
We use SemVer for versioning. For the versions available, see the [tags on this repository][https://github.com/turbulent/lorco/releases].