├── LICENSE ├── Quick Color └── quick-color.sketchplugin │ └── Contents │ └── Sketch │ ├── manifest.json │ └── quick-color.js └── README.md /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2016 Cole Perkins 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /Quick Color/quick-color.sketchplugin/Contents/Sketch/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name" : "Quick Color", 3 | "identifier" : "com.sketchapp.quickcolor", 4 | "version" : "1.0", 5 | "description" : "Apply colors from color palettes to a selection of objects.", 6 | "authorEmail" : "hello@coleperkins.com", 7 | "author" : "Cole Perkins", 8 | "commands" : [ 9 | { 10 | "script" : "quick-color.js", 11 | "handler" : "fillColorFromDocumentColorsForward", 12 | "shortcut" : "cmd ]", 13 | "name" : "Quick Document Color", 14 | "identifier" : "quick-document-color-forward" 15 | }, 16 | { 17 | "script" : "quick-color.js", 18 | "handler" : "fillColorFromDocumentColorsBackward", 19 | "shortcut" : "cmd [", 20 | "name" : "Quick Document Color", 21 | "identifier" : "quick-document-color-backward" 22 | }, 23 | { 24 | "script" : "quick-color.js", 25 | "handler" : "fillColorFromGlobalColorsForward", 26 | "shortcut" : "alt cmd ]", 27 | "name" : "Quick Global Color", 28 | "identifier" : "quick-global-color-forward" 29 | }, 30 | { 31 | "script" : "quick-color.js", 32 | "handler" : "fillColorFromGlobalColorsBackward", 33 | "shortcut" : "alt cmd [", 34 | "name" : "Quick Global Color", 35 | "identifier" : "quick-global-color-backward" 36 | } 37 | ], 38 | "menu": { 39 | "items": [ 40 | "quick-global-color-forward", 41 | "quick-global-color-backward", 42 | "-", 43 | "quick-document-color-forward", 44 | "quick-document-color-backward" 45 | ] 46 | } 47 | } 48 | -------------------------------------------------------------------------------- /Quick Color/quick-color.sketchplugin/Contents/Sketch/quick-color.js: -------------------------------------------------------------------------------- 1 | 2 | var fillColorFromGlobalColorsForward = function(context) { 3 | fillColorFormColors( 4 | context, 5 | NSApp.delegate().globalAssets().colors(), 6 | true, 7 | "You don't have any Global Colors Palette set yet" 8 | ); 9 | } 10 | 11 | var fillColorFromGlobalColorsBackward = function(context) { 12 | fillColorFormColors( 13 | context, 14 | NSApp.delegate().globalAssets().colors(), 15 | false, 16 | "You don't have any Global Colors Palette set yet" 17 | ); 18 | } 19 | 20 | var fillColorFromDocumentColorsForward = function(context) { 21 | fillColorFormColors( 22 | context, 23 | context.document.documentData().assets().colors(), 24 | true, 25 | "You don't have any Document Colors Palette set yet" 26 | ); 27 | } 28 | 29 | var fillColorFromDocumentColorsBackward = function(context) { 30 | fillColorFormColors( 31 | context, 32 | context.document.documentData().assets().colors(), 33 | false, 34 | "You don't have any Document Colors Palette set yet" 35 | ); 36 | } 37 | 38 | function fillColorFormColors(context, colors, forward, alertMessage) { 39 | var doc = context.document; 40 | 41 | if (colors.count() == 0) { 42 | doc.showMessage(alertMessage); 43 | return false; 44 | } 45 | 46 | var selection = context.selection; 47 | 48 | if (selection.count() == 0) { 49 | doc.showMessage("Please select one Shape or Text layer."); 50 | return false; 51 | } 52 | 53 | for (var i = 0; i < selection.count(); i++) { 54 | var layer = selection.objectAtIndex(i); 55 | if (layer.class() == "MSShapeGroup" || layer.class() == "MSTextLayer") { 56 | var index = colors.indexOfObject(getFillColor(layer)); 57 | 58 | if (forward) { 59 | if (index == 9.223372036854776e+18 || index == colors.count() - 1) { 60 | index = 0; 61 | } else { 62 | index ++; 63 | } 64 | } else { 65 | if (index == 9.223372036854776e+18 || index == 0) { 66 | index = colors.count() - 1; 67 | } else { 68 | index --; 69 | } 70 | } 71 | 72 | setFillColor(layer, colors.objectAtIndex(index)); 73 | } 74 | } 75 | 76 | } 77 | 78 | function getFillColor(layer) { 79 | if (layer.class() == "MSShapeGroup") { 80 | var fills = layer.style().enabledFills(); 81 | if (fills.count() > 0) { 82 | if (fills.lastObject().fillType() == 0) { 83 | return fills.lastObject().color(); 84 | } else { 85 | return null; 86 | } 87 | } else { 88 | return null; 89 | } 90 | } 91 | if (layer.class() == "MSTextLayer") { 92 | return layer.textColor(); 93 | } 94 | } 95 | 96 | function setFillColor(layer, color) { 97 | if (layer.class() == "MSShapeGroup") { 98 | var fills = layer.style().enabledFills(); 99 | if (fills.count() > 0 && fills.lastObject().fillType() == 0) { 100 | fills.lastObject().setColor(color); 101 | } else { 102 | var fill = layer.style().addStylePartOfType(0); 103 | fill.setFillType(0); 104 | fills.lastObject().setColor(color); 105 | } 106 | } 107 | if (layer.class() == "MSTextLayer") { 108 | layer.setTextColor(color); 109 | } 110 | } 111 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ![quickcolor header](https://user-images.githubusercontent.com/9797920/36362203-49bbb62c-14e7-11e8-91ae-118da7b19aed.png) 2 | 3 | 4 | ## Installation 5 | 6 | #### Method 1: ⚒ Sketch Toolbox 7 | 8 | Using Sketch Toolbox, search for 'QuickColor' and install. Doing so will enable you to automatically receive any updates to QuickColor without having to manually do so. 9 | 10 | #### Method 2: 📁 Manually 11 |
    12 |
  1. Download Pugin (.zip) and unzip
  2. 13 |
  3. Double clickquick-color.sketchplugin
  4. 14 |
15 | 16 | 17 | ## Usage 18 | Once you have color palettes set within your sketch file you can then use the shortcut to apply color to the selected elements. By pressing the shortcut again the next color in the in the palette will be applied. 19 | 20 | ## Shortcut Keys 21 | ![pluginshortcut](https://user-images.githubusercontent.com/9797920/36362136-b7cc2648-14e6-11e8-8deb-51156cb091c5.png) 22 | 23 |

Global Colors

24 | 28 |

Document Colors

29 | 33 | 34 | 35 | 36 | ![quickcolorshowcase](https://cloud.githubusercontent.com/assets/9797920/24823640/b7e40f0e-1bb5-11e7-905e-1d38ccb12830.gif) 37 | 38 | 39 | ## Info & Feedback 40 | If you have any questions, find a bug, or have ideas for ways to improve the plugin, please create an issue 41 | 42 |

💬 Contact me

43 | 47 | 48 | 🙏 Big thank you to Ashung for contributing 49 | --------------------------------------------------------------------------------