├── Demo ├── colors.jpg └── demo.gif ├── Matisse.sketchplugin └── Contents │ └── Sketch │ ├── manifest.json │ └── matisse.js ├── README.md └── icon.png /Demo/colors.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/arsfeshchenko/Matisse/b49aa19b9a97958f3fb32061cab97a865111e2eb/Demo/colors.jpg -------------------------------------------------------------------------------- /Demo/demo.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/arsfeshchenko/Matisse/b49aa19b9a97958f3fb32061cab97a865111e2eb/Demo/demo.gif -------------------------------------------------------------------------------- /Matisse.sketchplugin/Contents/Sketch/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name" : "🎨 Matisse", 3 | "identifier" : "com.sketchapp.painter", 4 | "version" : "1.2", 5 | "description" : "Superquick shortcuts for Global Colors", 6 | "icon" : "icon.png", 7 | "authorEmail" : "ars.feshchenko@gmail.com", 8 | "author" : "Arseniy Feshchenko", 9 | "commands" : [ 10 | { 11 | "script" : "matisse.js", 12 | "handler" : "fillColorFromGlobalColors0", 13 | "shortcut" : "ctrl 1", 14 | "name" : "Color 1", 15 | "identifier" : "сolor-1" 16 | }, 17 | { 18 | "script" : "matisse.js", 19 | "handler" : "fillColorFromGlobalColors1", 20 | "shortcut" : "ctrl 2", 21 | "name" : "Color 2", 22 | "identifier" : "сolor-2" 23 | }, 24 | { 25 | "script" : "matisse.js", 26 | "handler" : "fillColorFromGlobalColors2", 27 | "shortcut" : "ctrl 3", 28 | "name" : "Color 3", 29 | "identifier" : "сolor-3" 30 | }, 31 | { 32 | "script" : "matisse.js", 33 | "handler" : "fillColorFromGlobalColors3", 34 | "shortcut" : "ctrl 4", 35 | "name" : "Color 4", 36 | "identifier" : "сolor-4" 37 | }, 38 | { 39 | "script" : "matisse.js", 40 | "handler" : "fillColorFromGlobalColors4", 41 | "shortcut" : "ctrl 5", 42 | "name" : "Color 5", 43 | "identifier" : "сolor-5" 44 | }, 45 | { 46 | "script" : "matisse.js", 47 | "handler" : "fillColorFromGlobalColors5", 48 | "shortcut" : "ctrl 6", 49 | "name" : "Color 6", 50 | "identifier" : "сolor-6" 51 | }, 52 | { 53 | "script" : "matisse.js", 54 | "handler" : "fillColorFromGlobalColors6", 55 | "shortcut" : "ctrl 7", 56 | "name" : "Color 7", 57 | "identifier" : "сolor-7" 58 | }, 59 | { 60 | "script" : "matisse.js", 61 | "handler" : "fillColorFromGlobalColors7", 62 | "shortcut" : "ctrl 8", 63 | "name" : "Color 8", 64 | "identifier" : "сolor-8" 65 | }, 66 | { 67 | "script" : "matisse.js", 68 | "handler" : "fillColorFromGlobalColors8", 69 | "shortcut" : "ctrl 9", 70 | "name" : "Color 9", 71 | "identifier" : "сolor-9" 72 | }, 73 | { 74 | "script" : "matisse.js", 75 | "handler" : "fillColorFromGlobalColors9", 76 | "shortcut" : "ctrl 0", 77 | "name" : "Color 10", 78 | "identifier" : "сolor-10" 79 | }, 80 | ], 81 | "menu": { 82 | "items": [ 83 | "сolor-1", 84 | "сolor-2", 85 | "сolor-3", 86 | "сolor-4", 87 | "сolor-5", 88 | "сolor-6", 89 | "сolor-7", 90 | "сolor-8", 91 | "сolor-9", 92 | "сolor-10" 93 | ] 94 | } 95 | } 96 | -------------------------------------------------------------------------------- /Matisse.sketchplugin/Contents/Sketch/matisse.js: -------------------------------------------------------------------------------- 1 | 2 | var fillColorFromGlobalColors0 = function(context) { fillColorFormColors(0); } 3 | var fillColorFromGlobalColors1 = function(context) { fillColorFormColors(1); } 4 | var fillColorFromGlobalColors2 = function(context) { fillColorFormColors(2); } 5 | var fillColorFromGlobalColors3 = function(context) { fillColorFormColors(3); } 6 | var fillColorFromGlobalColors4 = function(context) { fillColorFormColors(4); } 7 | var fillColorFromGlobalColors5 = function(context) { fillColorFormColors(5); } 8 | var fillColorFromGlobalColors6 = function(context) { fillColorFormColors(6); } 9 | var fillColorFromGlobalColors7 = function(context) { fillColorFormColors(7); } 10 | var fillColorFromGlobalColors8 = function(context) { fillColorFormColors(8); } 11 | var fillColorFromGlobalColors9 = function(context) { fillColorFormColors(9); } 12 | 13 | 14 | function fillColorFormColors(index) { 15 | const sketch = require('sketch') 16 | 17 | var Style = sketch.Style 18 | // var Text = sketch.Text 19 | var document = sketch.getSelectedDocument() 20 | 21 | var selection = document.selectedLayers 22 | var color = MSPersistentAssetCollection.sharedGlobalAssets().colorAssets().objectAtIndex(index).color(); 23 | 24 | selection.forEach(function(layer) { 25 | 26 | if (layer.type == "Text") { 27 | layer.style.textColor = MSImmutableColor.colorWithRed_green_blue_alpha(color.red(), color.green(), color.blue(), color.alpha()) 28 | 29 | } else { 30 | layer.style.fills = [ 31 | { 32 | color: color, 33 | fill: Style.FillType.Color, 34 | } 35 | ] 36 | } 37 | }) 38 | } 39 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Matisse 2 | ### Sketch plugin 3 | 4 | ⚡️Superquick shortcuts for Global Colors 5 | 6 | Demo 7 |

8 | Demo 9 | 10 | 11 | 12 | ## Install with Sketch Runner 13 | With Sketch Runner, just go to the `install` command and search for `Matisse`. Runner allows you to manage plugins and do much more to speed up your workflow in Sketch. [Download Runner here](http://www.sketchrunner.com). 14 | 15 | 16 | 17 | 18 | 19 | 20 | ## Manual Install 21 | 22 | 1. [Download the repo](https://github.com/arsfeshchenko/Matisse/archive/master.zip) and extract it. 23 | 2. Double-click on `Matisse.sketchplugin` and click “Install” 24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/arsfeshchenko/Matisse/b49aa19b9a97958f3fb32061cab97a865111e2eb/icon.png --------------------------------------------------------------------------------