# Awesome Design Plugins * [Awesome Design Tools](https://github.com/LisaDziuba/Awesome-Design-Tools) * [Awesome Design UI Kits](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Awesome-Design-UI-Kits.md) * [Awesome Design Conferences](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Awesome-Design-Conferences.md)

         Awesome-Design-Plugins    awesome PRs Welcome

## How to Use and Contribute * Now you are in **Awesome Design Plugins** section, if you need tools — go to [Awesome Design Tools](https://github.com/LisaDziuba/Awesome-Design-Tools). * To find the tool, go through the Table of Contents or search for a keyword (for example, "animation", "prototyping"). * Ask [Lisa](https://twitter.com/LisaDziuba) on Twitter. If you found some great design tool or plugin, just send a Pull Request concerning our [Contribution Guidelines](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Contribution_Guidelines.md) (they're very simple, please take a look). Design tools should be submitted [here](https://github.com/LisaDziuba/Awesome-Design-Tools) and plugins in this file. We use such labels for Sketch ![Sketch](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg), Adobe XD ![Adobe XD](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) and Figma ![Figma](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) plugins, don't forget to add them. Now I'd love to see your suggestions!
## Table of Content * [Accessibility](#accessibility) * [Align & Arrange Plugins](#align--arrange) * [Analytics](#analytics) * [Charts](#charts) * [Code Export](#code-export) * [Code Highlight](#code-highlight) * [Collaboration](#collaboration) * [Color Management](#color-management) * [Copy & Paste](#copy--paste) * [Data Generation](#data-generation) * [Developers Handoff](#developers-handoff) * [Document Optimisation](#document-optimisation) * [Document Organisation](#document-organisation) * [Layout & Padding](#layout--padding) * [Export](#export) * [Generate UI](#generate-ui-element) * [Guides & Grids](#guides--grids) * [Images Management](#images-management) * [Import](#import) * [Map Generation](#map-generation) * [Mockup Plugins](#mockup-plugins) * [Other](#other) * [PDF Export](#pdf-export-plugins) * [Plugin Development](#plugin-development) * [Plugin Managers](#plugin-managers) * [Plugins Collection](#plugins-collection) * [Presentation & Preview](#presentation--preview) * [Prototyping](#prototyping) * [3D Perspective](#three-d-perspective) * [Rename Helper](#rename-helper) * [Resize](#resize) * [Selection Enhancement](#selection-enhancement) * [Shortcut & Keyboard](#shortcut--keyboard) * [State Management](#state-management) * [Style Management](#style-management) * [Symbols & Components](#symbols--components-management) * [Text Management](#text-management) * [Translation & Localization](#translation--localization) * [Typeface](#typeface) * [UI Kits](#ui-kits) * [User Flows](#user-flows) * [Version Control](#version-control) * [Website & HTML Export](#website--html-export) * [Workflow Improvements](#workflow-improvements) * [Zoom Enhancement](#zoom-enhancement)
### Accessibility

Abstract

* [Stark](http://www.getstark.co) — ensure your design is accessible and high contrast for every type of color blindness. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Cluse](https://cluse.cc) — a free and open-source Sketch plugin that allows you to test the color contrast of your design for accessibility and adjust colors without interrupting your workflow. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Color Contrast Analyser](https://github.com/getflourish/Sketch-Color-Contrast-Analyser) — a Sketch plugin that calculates the color contrast of two selected layers and evaluates it against the WCAG2.0. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Check Contrast](https://github.com/lifeofmle/check-contrast) — allows you to select layers in Sketch and get realtime feedback about the contrast ratio. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Contrast](https://github.com/romannurik/Sketch-Contrast#readme) — a Sketch plugin to show a pass/fail type contrast report. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Color Contrast Analyzer](https://github.com/eaugustine/Sketch-Color-Contrast-Analyzer) — a Sketch plugin that calculates the color contrast of two layers and evaluates them against MCOE's guidelines. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [A11y - Color Contrast Checker](https://www.figma.com/c/plugin/733159460536249875) — ensure your text is readable for users by adhering to WCAG (Web Content Accessibility Guidelines) standards. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Color Blind](https://www.figma.com/c/plugin/733343906244951586) — it allows you to view your designs in the 8 different types of color vision deficiencies. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Able – Friction free accessibility](https://www.figma.com/c/plugin/734693888346260052) — able makes accessibility easy while looking and feeling like Figma! ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Contrast](https://www.figma.com/c/plugin/748533339900865323) — contrast makes it easy to check the contrast ratios of colors as you work. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [A11y - Focus Orderer](https://www.figma.com/c/plugin/731310036968334777) — quickly annotate your designs’ focus/tab order flow. Why? Because not everyone uses a mouse cursor to navigate through online experiences; some people use the keyboard and/or other input devices. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Arabic & RTL Support](https://www.figma.com/c/plugin/732290356467065314) — write Arabic and RTL text in Figma with ease. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [VisualEyes](https://www.figma.com/c/plugin/740542057689267294) — measure the attention of your design inside Figma. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [RTL support](https://www.figma.com/c/plugin/739739050044773150) — flip RTL languages like Hebrew and Arabic. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [RTLPLZ - RTL Support](https://www.figma.com/c/plugin/742121299910255177) — write RTL text in Figma with fewer tears. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Epilepsy Blocker](https://www.figma.com/c/plugin/746367992714028465) — with this plugin you can make your designs accessible and safe for people with photosensitive epilepsy and also stay ADA Compliant. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [LTR to RTL by Alon Gruss](alon.gruss+xdplug@gmail.com) — use Ctrl+h or Cmd+h to flip from LTR text to RTL. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Func Creatives by Yaron Elharar](https://sugarsweetapps.com/func-creatives/) — adds custom shortcuts to Adobe XD, plus voice commands on Windows. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Align & Arrange * [Auto Arrange Artboards](https://github.com/srbsingh3/autoarrange) — automatically arrange the order of your artboards in the layer list according to their position on the canvas. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Aligny](https://github.com/stefan0uh/sketch-aligny) — an alignment enhance plugin for Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sequence Artboard Names](https://github.com/tbrasington/Sequence-Sketch-Artboards) — simple sequencing of all artboards within a Sketch Document. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Align To Grid](https://github.com/pravdomil/sketch-align-to-grid) — let's align selection to grid. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Groupie](https://github.com/aparajita/sketch-groupie) — sketch plugin providing commands to align layers with their parent group. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Guides](http://guides.pratikshah.website/) — allows you to quickly generate guides for a selected element and helps you achieve web development's famous grid (column) behavior in Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [IconFlower](https://medium.com/sketch-app-sources/sketch-app-plugin-iconflower-8fc84eef53d6) — arrange icons, images, and shapes in Phyllotaxis ( leaf arrangement) patterns. Leaf arrangement pattern in a sunflower, for example. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Organize Symbols](https://github.com/marianomike/sketch-organizesymbols) — a Sketch plugin that arranges symbol artboards. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [BaseAlign](https://github.com/abynim/BaseAlign) — a Sketch Plugin to align Text Layers by their baselines. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Artboard Tools](https://github.com/frankko/Artboard-Tools) — a Sketch plugins for arranging artboards and navigating between artboards. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Align To](https://github.com/LucienLee/AlignTo) — a Sketch 3 plugin that aligns layers relative to more options. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Align artboards and symbols](https://github.com/richardgazdik/sketch-align) — group and align your Sketch symbols and artboards by name. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Bootstrap Helpers](https://github.com/konki-vienna/sketch-bootstrap-helpers) — a plugin to help to work with bootstrap grids and grids in general. It allows to create (Bootstrap) grids and align and de-/increase the width of layers accordingly. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Symbol Override Padding](https://github.com/franklymrshankly/Symbol-Override-Padding) — add bottom padding to a symbol override. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Symbol Organizer](https://github.com/sonburn/symbol-organizer) — organize your symbols page and layer list, based on the symbol names. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Symbol and Artboard Organizer](https://github.com/Myrronth/symbol-and-artboard-organizer) — organize your symbols and artboards. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketchplugin Align Artboards](https://github.com/doubco/sketchplugin-align-artboards) — easily aligns all artboards vertical or horizontal by name. Uses the same convention as the Sketch export folder structure 'parent/child'. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Modulizer](https://github.com/Falkeyn/Modulizer) — modulizer plug-in for Sketch.app allows you easy control paddings for buttons, modules and areas. If your module has the background you can set fixed paddings and easily restore it for any content changes. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Pull to Center](https://github.com/delighted/sketch-pull-to-center) — pull to center: Move selected shapes or layers toward the center of the artboard. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SketchDistributor](https://github.com/PEZ/SketchDistributor) — distribute selection objects vertically or horizontally with a given spacing between them. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sort Me](https://github.com/romashamin/sort-me-sketch) — sort artboards and layers by name. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Move It](https://github.com/dawidw/move-it) — a Sketch plugin that lets you move selected layers vertically and horizontally. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Distribute Layers](https://github.com/wonderbit/sketch-distribute-layers) — a Sketch plug-in to distribute layers evenly. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Optically for Sketch](http://designplugins.com/optically) — automated and mathematically precise optical adjustments in Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SizeArtboard](https://github.com/BrendanMiller/SizeArtboard) — a Sketch Plugin for wrapping a new artboard around what you've selected. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Butter](https://github.com/pberrecloth/butter-sketch-plugin) — this plugin will butt your layers together. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Stacker](https://github.com/ScottSavarie/stacker) — a Sketch plugin to stack a selection horizontally or vertically. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Arrange Artboards](https://github.com/kenmoore/sketch-arrange-artboards) — layout all artboards in a grid with a user-specified number of rows. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SnipSnap](https://github.com/wescraig/SnipSnap) — remove extra padding on multiple layers or artboards with ease. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Plugin Skew](https://github.com/mheesakkers/sketch-plugin-skew) — a Sketch plugin for skewing (or shearing) shapes horizontally or vertically. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Align To Padding](https://github.com/franklymrshankly/Align-to-padding) — align layers in a group with padding applied. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Paddit](https://github.com/franklymrshankly/Paddit) — a Sketch plugin that adjusts a group's background to the content with padding. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Divider](https://github.com/jawayang/Sketch-Divider) — a plugin for Sketch to equal division layers by a container. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Super Tidy](https://www.figma.com/c/plugin/731260060173130163) — a Figma plugin to easily align, rename and reorder your frames based in their canvas position. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Sort It](https://www.figma.com/c/plugin/731324768889901500) — sort selected Frames or Layers by names. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Swap](https://www.figma.com/c/plugin/739493471028643540) — easily swap two selected objects. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Sorter](https://www.figma.com/c/plugin/742038190980789811) — a small utility plugin to help you sort/re-order layers in Figma. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Align To](https://www.figma.com/c/plugin/742450159822269057) — align layers to a specific layer, and have that layer stay fixed while the other layers move. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Reverse Layer Order](https://www.figma.com/c/plugin/738853407874474111) — this plugin will reverse the order of the selected layers. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Golden Ratio Align & Resize](https://www.figma.com/c/plugin/747059755185517110) — with this plugin, it's easy to use the Golden Ratio just everywhere you need it. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Distribute By](https://www.figma.com/c/plugin/761098431161143653) — a lightweight plugin that spaces elements evenly by the pixel. Distribute items vertically or horizontally from the edges or the centers. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Swapper](https://constanting.com/#contact) — a plugin that allows swapping position of two selected elements. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Apply Bounds](alexdobras@gmail.com) — copy and paste bounds: the position and/or the dimension from an item to reposition other items in bulk. Works with multiple items across multiple artboards. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Mask Fit](info@paolobiagini.com) — a command-like plugin that allows fitting images to their mask. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Artboard Plus](https://github.com/rodi01/Artboard-Plus-XD/blob/master/README.md) — artboard tools to speed up your Adobe XD workflow. Rearrange artboards into the grid, sort them by name or create an artboard around the selection. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Invisible Space](https://twitter.com/kenji_clown5) — add invisible space for isolation area around a logo, hit area wider than icon button looks, padding/margin of web component. You can create a gap around the selected objects by entering a padding value or separate value Top/Left/Bottom/Right. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Singari](https://sttk3.com/) — align/distribute to the key object. This plugin treats the last selected one as a key object. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Remove Decimal Numbers](https://www.eslamnasser.com/) — get that pixel-perfect design by removing the decimal numbers from element's width, height, rotation, x and y values. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [TrimIt](https://github.com/peterflynn/xd-trimit) — quickly trim Artboards and Area Text to perfectly fit their content, and snap Repeat Grid size to the closest whole grid cell. This plugin is open source and only about 150 lines of code! ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Move Items to Adjacent Place](https://onthehead.com) — move/duplicate items to adjacent places (left, top, right, bottom). ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Analytics * [Attention Insight](https://www.attentioninsight.com) — improve design performance with pre-launch analytics. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) ![Adobe XD](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Visualeyes](https://github.com/loceye/sketch-visualeyes) — generate attention heatmaps in seconds. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Useberry](https://www.useberry.com/integrations/adobe-xd/) — user testing feedback and users’ behavior insights with heatmaps, video recordings, user flows, time bars and follow-up questions. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Userlytics](https://www.userlytics.com/faq) — allows you to easily configure and create a user experience test directly from your XD prototype so you can watch and listen to your target Persona interact with and answer questions. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [UserTesting](support@usertesting.com) — the UserTesting plugin enables you to seamlessly transition from designing a digital experience to soliciting immediate customer validation. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [User journey](https://github.com/mcoulthurst/xd-user-journey/blob/master/README.md) — this plugin renders a user journey map from external CSV text data. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Mupixa](https://mupixa.com) — allows you to leverage the full potential of your prototypes by conducting usability research fast and effortlessly. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Vempathy](https://vempathy.tech/plugins/adobe-xd/) — get feedback on your design where it matters: users emotional reactions. With the Vempathy plugin you will build better digital experiences with rapid customer feedback and analysis powered by AI. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Charts * [Sketchy Pies](https://github.com/abynim/sketchy-pies) — a Sketch plugin to magically convert regular circle layers into pie charts! ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [AEFlowchart](https://github.com/tadija/AEFlowchart) — Flowchart diagram plugin for Bohemian Coding Sketch app. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Flowmate](https://github.com/wodory/flowmate) — a Sketch plugin to draw flowchart and diagram. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Segmented Circle](https://github.com/design4use/gb-sketch-segmentcircle) — create precise segmented circular graphics for diagrams, instrumentation, and analytics. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sparkliner](https://github.com/Volorf/Sparkliner) — easy way to make sparkline graph. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Freeman Finchart Sketchplugin](https://github.com/freeman990/Freeman-FinChart-SketchPlugin) — draw a financial charts like candle-stick or line charts like a boss. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Charts](https://www.figma.com/c/plugin/731451122947612104) — charts allows you to generate charts that can be added and edited within your Figma document. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Chart](https://www.figma.com/c/plugin/734590934750866002) — chart is a plugin for Figma that uses real or random data to create the most popular charts. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [simpleflow](https://www.figma.com/c/plugin/751821593330638172) — makes it easy to create a flowchart with customizing a theme, you can choose the color, the dashed style or even the curvature of the flowchart. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Datavizer](https://www.figma.com/c/plugin/736737028247625415) — create a bar chart, scatter plot, or line chart easily with your data. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Odin Chart](https://app.odinchart.com/faq) — a tool for a chart and map design in Adobe XDBring your own spreadsheet or use randomly generated data to place your designs in XD. This plugin requires a free account with Odin Chart. Sign up is easy and can be done through the plugin. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Code Export * [iosViews](https://github.com/Charimon/iosViews) — a Sketch plugin to generate iOS view code. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Copy Swift Code](https://github.com/ngs/sketchplugin-swift-color) — a Sketch plugin for generating UIColor and NSColor initializer Swift code from fill color of selected layers. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Copy Objective-C Code](https://github.com/jaimeeee/sketchplugin-objc-color) — a Sketch plugin for generating UIColor and NSColor initializer Objective-C code from fill color of selected layers. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [CSS Sprite Mixin](https://github.com/littlebusters/Sketch-CSS-Sprite-Mixin) — copy mixin code for SCSS, Less and Stylus to the clipboard in Sketch 3. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Markup Listify](https://github.com/marisaroque/sketch-markup-listify) — a Sketch plugin for convert and copy text layers into HTML lists. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Copy Framer Code](https://github.com/perrysmotors/copy-framer-code) — a Sketch plugin that copies any selected layer to the clipboard as code that can be pasted straight into a Framer prototype. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Cracker9 Sketch Plugin](https://github.com/Cracker9/cracker9-sketch-plugin) — cracker9 code-snippet sketch plugin. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch To View](https://github.com/kiranpuppala/sketch-to-view) — generate android views from sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [DesignToken2Code](https://github.com/m-yoshiro/DesignToken2Code) — convert design tokens to SCSS variables as code. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Color Vars](https://github.com/philsinatra/Sketch-Color-Vars) — a Sketch plugin that will export the fill color of selected layers to SCSS, LESS and CSS files. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [typex](https://github.com/reinvanoyen/typex) — highly configurable text styles to the web (CSS, sass, HTML, JSON, ...) export plugin ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SVG to React Component](https://github.com/reeli/sketch-svg-to-react-component) — a Sketch plugin to compress SVG and transform it to React (include React Native) components. By copy React component directly to your clipboard or export as files. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [PaintCode Code Generator](https://www.paintcodeapp.com/sketch) — convert your Sketch drawings into Swift or Objective-C. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Copy as React Component (JSX)](https://github.com/jasondonnette/sketch-copy-as-react-component) — generate React components from Sketch with a keyboard shortcut. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [scssketch](https://github.com/devmynd/scssketch) — custom tools for living the ultimate the TAND&M; life. Built with love and care by Sarah Aslanifar, Drew Vosburg, and Max Oppenheimer. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [imgcook](https://github.com/taobaofed/imgcook) — a cook who can transform the design to code. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Presto-Dom-Gen](https://github.com/iarthstar/presto-dom-code) — generates Presto Dom Code from Sketch Layers. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [bztone-plugin](https://github.com/wangjunwangjunwang/sketch2pixi-plugin) — convert Sketch layers to JSON. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Exchanger](https://github.com/littlebusters/Sketch-Exchanger) — convert from Sketch to JSON w/assets and JSON w/assets to Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [CSSketch](https://github.com/JohnCoates/CSSketch) — CSS Stylesheet integration to improve your workflow, with Less support. Attach once, updates your design automatically on stylesheet changes. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [StyleClip](https://github.com/liawesomesaucer/StyleClip) — a Sketch plugin that copies an element's styles directly to your Mac clipboard. Supports CSS & SCSS. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Style To React Native](https://github.com/futantan/sketch-style-to-react-native) — a Sketch plugin that copies an element's styles in React Native way directly to your Mac clipboard. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [CSSGen](https://www.figma.com/c/plugin/742750636238601912) — generate CSS Preprocessors SASS/LESS from your local Figma styles. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Icon2Code](https://www.figma.com/c/plugin/741549820671978943) — easily create a JSON file for your fellow developers with everything they need to create a custom Icon component using their favorite framework or library (React, Angular, Vue, etc.). ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Copy CSS to Clipboard](https://github.com/peterflynn/xd-copy-css-code) — quickly copy CSS code for text styles, colors, gradients, shadows, etc. to the clipboard. This plugin is open source and only 200 lines of code! ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [convert scss variables](workdrive0306@gmail.com) — Xd plugin for frontend engineer, Xd object to scss color and font size and font family variables. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Lightning Storm](http://exportkit.com/help) — create web, mobile and desktop apps instantly. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Code Highlight * [Sketch Syntax Highlighter](https://danielguillan.github.io/sketch-syntax-highlighter/) — automatically highlight the syntax of any code snippet, right within Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Codelight](https://github.com/somebee/sketch-codelight) — highlight code inside Text layers in Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg)
### Collaboration * [Google Sheets Content Sync](https://github.com/DWilliames/Google-sheets-content-sync-sketch-plugin) — edit and collaborate on your content in Google Sheets, then sync in back to your sketch files. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sync](https://github.com/nolastan/sync.sketchplugin) — use Google Sheets to sync typography across your team. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Dapollo](https://www.yuque.com/dapollo/group/welcome) — design and Development Platform(一站式设计开发工作台) ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Prott Sketch Plugin](https://github.com/goodpatch/Prott-Sketch-Plugin) — sync Sketch artboards to Prott like a boss. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Plot](https://plotapp.co) — collaborate with your design team in a new way ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Frontify Plugin](https://github.com/Frontify/sketch) — connecting your brand and design worlds ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Sync](https://sensive.co) — create a collaboration hub for your Sketch files. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Quopi](https://github.com/LukeFinch/Quopi) — fetches copy from the comments on your Abstract branch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Kopie](https://kopie.io) — the copy-editing tool for web and product design ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Figma Chat](https://www.figma.com/c/plugin/742073255743594050) — this plugin helps you to interact inside your files with other peoples. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Status](https://www.figma.com/c/plugin/742769304454952644) — when collaborating on features with multiple designers and developers, it can be hard to keep track of which designs are ready to be implemented and what is still a work in progress. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [GoProof](support@goproof.net) — the GoProof plugin for Adobe XD brings proofing and collaboration on prototypes into the GoProof ecosystem, enabling app and web designers to manage XD work alongside all their other Adobe Creative Cloud media in an effortless and natural workflow. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Slope](hello@goslope.com) — an easy way for teams to manage creative projects and tasks. With the Slope plugin, designers will be able to view a list of their tasks in XD that they are assigned to in Slope, and then request feedback or approval from stakeholders. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Bluescape](support@bluescape.com) — interface with Bluescape, a visual collaboration platform, without having to leave Adobe Creative Cloud.- Export your Adobe designs directly to a workspace- Receive and respond to comments- Import images into your working document from BluescapeTo access the plugin, you will need a Bluescape account. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Mixed](https://mixed.io) — Share on Mixed – communicate with voice, collaborate in real-time. Annotate, feedback & sketch together with simple visual tools. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Color Management * [Adjustments](https://www.figma.com/c/plugin/798711644668166520/Adjustments) - HSL color adjustment plugin for Figma. Tweak hue, saturation and lightness values of multiple selected objects simultaneously. ![Figma](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [sketch-retain-text-color](https://github.com/johnmcclumpha/sketch-retain-text-color) — retain the original color of text layers when applying a Text Style. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [color-locator](https://github.com/anavarromartin/sketch-color-locator) — find all instances of a HEX color. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [add-colors-to-palette](https://github.com/johnmcclumpha/sketch-add-colors-to-palette) — quickly and easily add colors from the fills of selected layers in a Sketch file to the document palette. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [color-swatcher](https://github.com/akiersky/color-swatcher) — a Sketch plugin to analyze document colors and show the WCAG color contrast value. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [add-selected-colors](https://github.com/jorgemartins/add-selected-colors) — add selected colors to document palette, sketch plugin. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [import-colors](https://github.com/Ashung/import-colors-sketch) — import colors from swatches file to Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [ColorSpark for Sketch](https://colorspark.app/sketch) — a simple tool to help designers discover unique colors and gradients directly in Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [keyColor](https://github.com/KevinGutowski/keyColor) — a Sketch plugin to apply colors via the keyboard. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [sketch-easing-gradients](https://github.com/larsenwork/sketch-easing-gradient) — supercharge your gradients in Sketch with no-linear color mix and custom color spaces ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Bonsai Standards](https://github.com/thechinesekid/bonsai-plugin) — update all the colors in an artboard to the latest Bonsai colors. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Chromata](https://github.com/abnamrocoesd/Chromata) — find rogue colors ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Icons](https://github.com/AMoreaux/Sketch-Icons) — import your icons, apply a color mask and create a dynamic icons library. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch WCAG](https://github.com/bryanberger/sketch-wcag) — a Sketch plugin that lets you contrast test your entire color palette against the WCAG guidelines all at once. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Palette Generator](https://github.com/awkward/sketch-palette-generator) — output a JSON color palette to Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Appalette](https://github.com/Carlosarturo28/Appalette) — a Sketch plugin that lets you find the color palette of (almost) any App. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [CopyColor](https://github.com/poyi/CopyColor) — a plugin that provides a shortcut to copy layer fill color, border color, or text color to your clipboard for Sketch 4. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [QuickColor](https://github.com/colesperks/QuickColor) — a Sketch plugin that lets you quickly apply colors from the color palette to selected elements. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [arrowfy](https://github.com/joclin/arrowfy) — add a simple arrowhead to end of selected paths. Matches color and weight. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Open Color Plugin for Sketch](http://opencolor.tools/) — a Sketch plugin to support the open color file format ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Prism](https://github.com/LaloMrtnz/Prism) — creates a beautiful artboard color palette with all your 'Document Colors' and their respective color label in a variety of formats. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Copy Color as HSLA](https://github.com/peterwooley/copy-color-as-hsla) — a plugin to copy the fill, border, or text color of the selected layer to the clipboard as HSLA. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Image Average Color](https://github.com/AntonioJMartinez/sketch-ImageAverageColor) — a plugin to save and use the average color of an image. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Colorpeek](https://github.com/peterwooley/colorpeek-sketch-plugin) — gathers the colors used in your selected layers and shows them in Colorpeek. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Color Picker Plus](https://github.com/heysketch/sketch-color-picker-plus) — set borders color using standard Sketch color picker ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sass Colors](https://github.com/arshad/Sketch-Sass-Colors) — displays colors as preconfigure Sass variables for Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Palettes](https://github.com/andrewfiorillo/sketch-palettes) — a Sketch plugin that lets you save and load colors in the color picker ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Material Design Color Palette](https://github.com/t32k/material-design-color-palette) — a Sketch app plugin for displaying Google material design color palette. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Copy SCSS Colors](https://github.com/graphical-iain/Copy-SCSS-Colors) — a Sketch.app Plugin to copy colors to clipboard as SCSS variable definitions. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Color Copier](https://github.com/mfouquet/Color-Copier) — a Sketch plugin to quickly copy color RGB/HEX values. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Style Inventory](https://github.com/getflourish/Sketch-Style-Inventory) — generate a visual style sheet with all colors and text styles that you are using in Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Swap Fill & Border](https://github.com/nathco/Swap-Fill-Border) — a Sketch.app plugin for swapping fill and border colors. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch iOS Bar Color Calculator](https://github.com/einancunlu/Sketch-iOS-Bar-Color-Calculator) — a Sketch plugin that calculates and applies the correct color for you to get actual design color after applying it to a translucent UIToolbar or UINavigationBar. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Chromatic Sketch](https://github.com/petterheterjag/chromatic-sketch) — create good-looking and perceptually uniform gradients and color scales. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Palette Stripes](https://github.com/sureskumar/palette-stripes) — generate palette stripes in sketch from shape fills. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Alembic](https://alembicforsketch.com) — a Sketch plugin to extract a color palette from any layer that contains bitmap data. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Chain](https://lalomts.github.io/Chain/) — dynamic color relations in Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Replace Colour](https://github.com/lewishowles/sketch-replace-colour) — Replace all fill or text colours matching the selected layer ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Convert To Grayscale](https://github.com/mheesakkers/sketch-plugin-convert-to-grayscale) — a simple Sketch plugin to convert selected shapes to grayscale colors ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [HSL Color Picker](https://github.com/Ashung/HSL_Color_Picker) — HSL Color Picker for Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Randomcolors](https://github.com/avadhbsd/RandomColors) — a Sketch App Plugin For Applying Random Colors To A Selection Of Objects. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Color Palette](https://github.com/nerd0geek1/SketchColorPalette) — a Sketch Plugin to generate .clr(Color Palette) file from selected layers. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Swatches](https://github.com/Ashung/Sketch_Swatches) — a swatches plugin for Sketch, include Material Design, Open Color, RAL, TOYO, Pantone and more. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [ColorBrightness](https://github.com/andex/ColorBrightness) — Color Brightness sketch plugin ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Colormate](https://github.com/themainingredient/colormate) — a sketch plugin that will help you figure out how in the hell you ended up with 457 different greys, instead of the 1 grey Mandy gave you in the handover. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [img-pal-gen](https://github.com/iarthstar/Image2Palette) — generates Color Palette from Image Layer ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Blender](https://github.com/bunnieabc/Blender) — a sketch plugin to create awesome gradient layers ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [GGradient](https://github.com/andex/ggradient) — simple way to create perfect gradient ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [CoolHue](https://github.com/webkul/coolhue) — coolest handpicked Gradient Palette for super amazing stuff ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Palette](https://www.figma.com/c/plugin/742549221432366731) — palette helps you create the perfect color palette through machine learning from Colormind. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Image Palette](https://www.figma.com/c/plugin/731841207668879837) — extracts a color palette of 5 different colors from the selected images. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [uiGradients](https://www.figma.com/c/plugin/744909029427810418) — adds gradients to groups, text and frames in a single click. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Color Palettes](https://www.figma.com/c/plugin/740832935938649295) — find the best color palette from the huge list of best color palettes. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Color filters...](https://www.figma.com/c/plugin/735658738614175372) — a simple plugin that allows you to quick convert all the colors in you selected layers or frames. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Dominant Color Toolkit](https://www.figma.com/c/plugin/744725347356614754) — generate a palette from an image to magically populate your designs. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Brands Colors](https://www.figma.com/c/plugin/740232388085828578) — find the best color from the world's best brands and cool apps. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Chroma](https://www.figma.com/c/plugin/739237058450529919) — create bulk color styles from the selection. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [GradientiMe](https://www.figma.com/c/plugin/739800909357948721) — simply generates a rectangle layer with the gradient selected. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Color Designer](https://www.figma.com/c/plugin/739475857305927370) — the plugin generates shades, tints, and color harmonies based on select layers or local styles. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Invert Color](https://www.figma.com/c/plugin/738840049488759901) — invert backgrounds, fills, strokes & effects colors. Apply change to multiple selected shapes, texts, frames etc. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Color Compass](https://www.figma.com/c/plugin/754415266574382747) — this plugin was designed to make choosing colors a more accurate and efficient affair by generating interactive swatches using a single base color. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Color Combinator](https://www.figma.com/c/plugin/755559299451656995) — a Figma plugin for exploring different combinations of colors among elements. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Chromatic Figma](https://www.figma.com/c/plugin/759433498184507623) — lets you use other color spaces than RGB, such as Lab and Lch, to create good-looking and perceptually uniform gradients and color scales. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Compliments](https://www.figma.com/c/plugin/741291546405622147) — use this simple plugin to find complementary, split complementary, triad, tetrad, monochromatic, and analogous colors to a selected layer's fill. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Photo to Palette](https://www.figma.com/c/plugin/744287694483504163) — generates colour palette from selected images. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Navigator](https://www.figma.com/c/plugin/739558587628004077) — an easy way to find and apply color styles from your current document. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Shadow Picker](https://www.figma.com/c/plugin/744987207861965946) — quickly apply various shadows to layers with just 2 clicks. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Instant Color](https://abdnahid.com) — generate 470+ colors of Ant Design, Tailwind and Flutter in your artboard. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Random Colors by Alon Gruss](alon.gruss+xdplug@gmail.com) — Randomly generated color objects! ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [material palette](https://t.me/savedata_space) — on-screen material palette ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [ColorSpark](https://github.com/lukecjohnson/ColorSpark-for-XD) — ColorSpark for Adobe XD allows designers to quickly generate random colors and gradients directly in their XD projects. With ColorSpark, designers are sure to discover truly unique colors and striking gradients. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Color Scale](https://github.com/masa-sumimoto/adobe-xd-color-scale) — a plugin that can generate color scales. Select one Text, Rectangle, or Ellipse node and run the plugin. You can get graded colors from the node fill color towards white, black, complementary colors etc. You can also get a color scale by selecting two specific nodes. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [GDS palette](https://github.com/mcoulthurst/xd-gds-palette/blob/master/README.md) — import color palette used in the GOV.UK Design System. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [create color palette](workdrive0306@gmail.com) — XD plugin for frontend engineer, Xd object to color palettes. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Complex Gradients](mightyskeet@gmail.com) — several useful tools for gradient fills. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Color Blender](https://github.com/peterflynn/xd-color-blender) — fill colors across a set of selected objects. Can also auto-create the intermediate objects by cloning if you only have two objects selected. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Chromatic Gradients](https://github.com/aancuta/XD-chromaticPlugin) — this XD plugin lets you create an approximation of a gradient in other color spaces, like LAB. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Color Ranger](https://qooqee.com/crhelp) — colorRanger gives you the power to adjust brightness, saturation, hue and color depth in one click. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Select Same Color](can@canpoyrazoglu.com) — when an item is selected, allows quick selection of items with the same fill, border, or shadow. Supports both solid colors and linear gradients. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Material Color Pallets](n.bhargavvenky@gmail.com) — this Plugin Provides Material Color Pallets to Use in your Project. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Copy & Paste * [Copy to All](https://github.com/wuwa/sketch-copy-to-all) — sketch - copy to all artboards plugin ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Duplicate to New Artboard](https://github.com/delighted/sketch-duplicate-to-new-artboard) — a Sketch plugin to duplicate the current selection(s) to new artboard(s). ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Duplicator](https://github.com/turbobabr/Duplicator) — a Sketch 3 plugin that takes the currently selected layers and copies them one or multiple times in a specified direction. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Repeat](https://github.com/keremciu/sketch-repeat) — this plugin helps you easily duplicate your objects to all Artboards. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Copy Paste Layout Settings](https://github.com/FrancisVega/sketch-copy-paste-layout-settings) — copy layout settings from one artboard and paste into multiples artboards. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Clipboard to Tilled Fill](https://github.com/midiway/Clipboard2TilledFill) — allows you to copy an image file from Finder (PNG, JPG) and set it as a tilled fill of selected shape(s). ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Paste Direct](https://github.com/yudiz-solutions/paste-direct) — design like a guitarist! ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Proportional Replicator](https://github.com/AleLudovici/sketch-proportional-replicator) — this plugin for Sketch takes the selected layer and create new rectangles with sizes proportional to it. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Better Paste](https://github.com/kenmoore/Sketch-Better-Paste) — paste like it was meant to be--into the artboard you're viewing. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Component Cloner](https://www.figma.com/c/plugin/736564662640346811) — with component cloner, you can select component instances you want to copy and they'll be assigned to a new copy of their original master component. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Blend](https://www.figma.com/c/plugin/735442706723922553) — blend plugin allows you to copy any object along the path. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Paste to Fill](https://www.figma.com/c/plugin/740097744539225981) — copy an image and paste it as fill on your selected layers. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Paste to Mask](https://www.figma.com/c/plugin/741413612560725424) — use your selected layers as Mask for the image in your clipboard. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Multiply](https://www.figma.com/c/plugin/751760002167220558) — quickly multiply a layer in rows, columns or both (grid) ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg)
### Data Generation

Abstract

* [Iconscout](https://github.com/iconscout/icondrop) — get access to 2 million+ icons, illustration, and stock images right into your design app. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [liveplanet-sketch-datasupplier](https://github.com/Craigtut/liveplanet-sketch-datasupplier) — supply's real data from Live Planet's api to sketch for testing designs ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [jerryipsum](https://github.com/vinceangeloni/jerryipsum) — a Seinfeld data plugin for Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Turkish Data](https://github.com/ozgurgunes/Sketch-Turkish-Data) — Turkish data supplier plugin. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Airtabledata](https://sketchairtabledataplugin.com/) — use your Airtable data in your Sketch symbols ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [CSV Mail Merge](https://github.com/jdwolk/sketch-csv-mailmerge) — a lightweight Sketch plugin for importing data from .csv files using "{}" text sections. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [chemofill](https://github.com/ahadik/chemofill) — a Chemical Structure data supplier plugin. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [VK-Data](https://github.com/VKCOM/vkdata-sketchplugin) — a plugin for using data from your account at vk.com ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [PersianSupplier](https://github.com/hiradarshadi/PersianSupplier) — a Sketch Plugin for supplying dynamic Persian data. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Data Faker](https://github.com/paintedbicycle/sketch-data-faker) — a Sketch data plugin providing data for you mockups from Faker.js ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [stuffing](https://github.com/Ashung/Sketch-Stuffing) — a DataSupplier plugin which supplies Chinese data. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Chippen charts](https://github.com/smallmultiples/sketch-chippencharts) — a bar chart creator for your mockups using random data. Change the size of the selected rectangles. Works for both horizontal and vertical bar charts. Made with love in Chippendale. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [chart](https://github.com/pavelkuligin/chart) — create the most popular types of charts by real or random data ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [TinyFaces](https://github.com/maximedegreve/TinyFaces-Sketch-Plugin) — fill the content with random avatars & data ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Export Text](https://github.com/exevil/Sketch-Export-Text) — it helps you to save all text data on the current page in customizable format and filter the excess. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Shopify Data Populator](https://github.com/levinmejia/sketch-shopify-data-populator) — a Sketch App plugin to populate your designs with meaningful ecommerce data. Goodbye Lorem Ipsum. Hello JSON. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch JSON Parser](https://github.com/kvendrik/sketch-json-parser) — replaces layer values in groups with JSON data ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Data Populator](https://github.com/preciousforever/sketch-data-populator) — a Sketch App plugin to populate your documents with meaningful data. Goodbye Lorem Ipsum. Hello JSON. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Mail Merge](https://github.com/kumo/sketch-mail-merge) — a Sketch plugin that allows you to duplicate a layer/artboard and replace the text with CSV data. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Content Generator](https://github.com/timuric/Content-generator-sketch-plugin) — a Sketch app plugin for generating dummy data such as avatars, names, photos, geo data etc. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Data Studio](http://thetylerwolf.github.io/sketch-data-studio) — a Sketch plugin to generate charts and data for data tables. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Foreign Ipsum](https://github.com/3raxton/foreignipsum) — generate text for your mockups in multiple languages. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Random Ipsom](https://github.com/fliptopbox/random-ipsom) — a latin text generator similar to Lorem Ipsum. The plugin outputs randomly ordered paragraph text with three variations. You can use a random word count, a specific word count or inject random content into the existing text blocks. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Fake Chinese Name for Sketch](https://github.com/JJYing/fake-chinese-name-for-sketch) — generate Chinese names for text layers. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Lorem Ipsum 2017](https://github.com/freeauto/sketch-lorem-ipsum-2017) — a Sketch plugin to generate "lorem ipsum" text. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [English and Persian Lorem Ipsum](https://github.com/Rezaaa/english-and-persian-lorem-ipsum) — a Sketch extension to generate English and Persian lorem ipsum text. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Bacon Ipsum](https://github.com/zcallan/sketch-bacon-ipsum) — a simple & easy Bacon Ipsum text generator for Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [charapara](https://github.com/kd-co/charapara-sketch-extension) — Charapara, an initiative by Kerala Designers Collaborative (KDCo), is a dummy text generator for Malayalam ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [BRData](https://github.com/jonathasbsouza/brdata) — gerador de dados contextualizados com a realidade brasileira. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Ipsum](https://github.com/BohemianCoding/sketch-ipsum) — a DataSupplier plugin that fills your text layers with random Lorem Ipsum ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Unsplasher](https://github.com/perrysmotors/sketch-unsplasher) — fills shapes or symbols with images from Unsplash ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [P5 Sketchplugin](https://github.com/jacopocolo/p5-sketchplugin) — a plugin for using p5.js code inside Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Jane Doe](https://github.com/konki-vienna/jane_doe) — this Sketch Data plugin adds localized profile names (powered by uinames.com) to your design. - Get diversity into your content. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Shutterstock](https://www.shutterstock.com/explore/shutterstock-sketch-plugin) — access Shutterstock's stunning images without leaving your workspace. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Design Systems](https://github.com/Ashung/design-systems) — it helps you find out popular design systems and download the official Sketch UI kit. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Day Player](https://github.com/tylergaw/day-player) — a collection of Sketch Plugins for creating placeholder images. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [JSON to Layers](https://github.com/littlebusters/JSON-to-Layers) — convert to Layers on Sketch from JSON (with Fireworks PNG structure). ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Artwork Fetcher](https://github.com/mmth/sketch-artwork-fetcher) — a Sketch plugin for fetching artworks from Last.fm web-service and filling selected shapes with them. Allows fetching artworks by their album and/or artist names. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Logo Fetcher](https://github.com/soulchild/sketch-logo-fetcher) — place logos from either the Logos API (SVG format) or Clearbit API (PNG format) ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Unsplash It](https://github.com/fhuel/Unsplash-It-Sketch) — a plugin to quickly include great-looking image from Unsplash.com in your Sketch projects. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Date Generator](https://github.com/bshorta/date-generator-sketch) — a random date generator plugin for Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Icon Fetcher](https://github.com/sagishrieber/sketch-any-icon-fetcher) — this plugin will let you insert any website's favicon, or iOS/Android app's icon into your design ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SketchContentSync](https://github.com/contentsync/SketchContentSync) — sync sketch files with google docs. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Diverse UI Sketch Plugin](https://github.com/reneepadgham/diverseui-sketch-plugin) — the official Sketch plugin for Diverse UI. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Logodrop](https://github.com/Iconscout/logodrop) — a Sketch Plugin to get brand logos right into Sketch App. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Drake](https://github.com/okcoker/Drake-Sketch-Plugin) — a Sketch plugin for generating dummy Drake content such as photos and lyrics. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Cats](https://github.com/pravdomil/Sketch-cats) — render layers in Sketch as various images of cats ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Event Badges By David](https://github.com/designforhuman/event-badges-by-david) — a Sketch plugin to make a large number of name tags for any kind of events ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [100 Shapesum](https://github.com/markaleksanderh/100-shapesum) — a Lorem Ipsum Sketch plugin based on 100 Shapes tone of voice. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [uiLogos](https://github.com/realvjy/uiLogos-sketch-plugin) — insert professionally designed dummy logos of companies. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Seoul](https://github.com/sunkibaek/Seoul) — a sketch data supplier plugin for random Korean names. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [IBAN Generator](https://github.com/idriesalbender/iban-sketch-plugin) — generate random International Bank Account Numbers (IBAN) ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [String Value Puller](https://github.com/YannickWidmer/sketch_strings_puller) — a plugin to handle pull string values from github repositories. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [foodreau](https://github.com/maxdavid/sketch-foodreau) — a data supplier plugin for populating designs with real food recipes. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Brandfolder](https://github.com/brandfolder/sketch-plugin-brandfolder) — easily use your digital assets from Brandfolder right within your favorite platform for digital design! ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Excel Content Sync](https://github.com/wousser/SketchExcelContentSync) — decouple and Sync multi-language content between Excel and Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Unsplash](https://www.figma.com/c/plugin/738454987945972471) — insert beautiful images from Unsplash straight into your designs. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Content Reel](https://www.figma.com/c/plugin/731627216655469013) — need content for your layouts? Content Reel helps you easily pull text strings, avatars and icons into your designs. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Lorem ipsum](https://www.figma.com/c/plugin/736000994034548392) — generate ‘Lorem ipsum’ to fill your text layers with dummy text. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Google Sheets Sync](https://www.figma.com/c/plugin/735770583268406934) — Sync content from Google Sheets directly into your Figma file. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Avatars](https://www.figma.com/c/plugin/739659977030056719) — add random user avatars to your designs with one click. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Brandfetch](https://www.figma.com/c/plugin/733590967040604714) — tired of looking for a company's logo? Check this plugin.![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Table Generator](https://www.figma.com/c/plugin/735922920471082658) — Table Generator plugin automates the addition of tabular data. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Humaaans for Figma](https://www.figma.com/c/plugin/739503328703046360) — this plugin brings the amazing illustrations library called Humaaans by Pablo Stanley to Figma. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Data Lab](https://www.figma.com/c/plugin/740286071386014712) — paste random or real data into text layers and components easily. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [QR Code Generator](https://www.figma.com/c/plugin/735650288109030027) — ‘QR Code Generator’ helps you to quickly create a Vector QR code. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Photos](https://www.figma.com/c/plugin/745428728979155171) — search and insert photos from Flickr into your Figma files. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Random Name Generator](https://www.figma.com/c/plugin/742770131320902341) — select text layers and run the plugin to populate them with random names, or just run the plugin and get a new text layer with a random name. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Lorem Ipsum Generator](https://www.figma.com/c/plugin/742039398983091764) — Lorem Ipsum Generator, with two clicks generates random text in Figma. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [User Profile](https://janisrozenfelds.com/user-profile-plugin) — enables designers to display beautiful generated avatars in your design prototype. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Avatars generator](https://www.figma.com/c/plugin/746656816456492537) — Avatars Generator creates unique, AI-generated photos of a fictional persons. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Smart Data](https://www.figma.com/c/plugin/751874861800404329) — Smart Data inserts random data according to the text layer name. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Airtable to Figma](https://www.figma.com/c/plugin/741940457537193498) — this plugin allows you to effortlessly pull text and images from an Airtable database and inject them straight into your Figma components. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Simple Table Generator](https://www.figma.com/c/plugin/754386961063964303) — this plugin generate tables with information from Excel/Google Sheet. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Data From Local](https://www.figma.com/c/plugin/759249283654441170) — insert data from local TXT files or images. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Random Key Generator](https://www.figma.com/c/plugin/761525248810814854) — quickly generate a random data string with alphabets, numerals, and symbols depending on your needs for use as IDs and secrets in your mocks. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Flags](https://www.figma.com/c/plugin/749888869584535589) — add country flags to your Figma designs. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [JSON Populate](https://www.figma.com/c/plugin/749195619095691211) — use your own real JSON data to populate your text layers. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [sigils](https://www.figma.com/c/plugin/755929849994721127) — Sigils is an avatar generated for Urbit IDs. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Figmoji](https://www.figma.com/c/plugin/736612173445813953) — add emojis seamlessly onto your designs. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Table Master 3000](https://www.figma.com/c/plugin/758316324890482782) — easily switch between column work and row work. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Placeholder Image](https://twitter.com/ispykenny) — Placeholder Image for your designs and wireframes. All images are provided by https://placeholder.com/ ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Unsplash Random Image](amirzenoozi72@gmail.com) — this plugin just generate a random image for your design ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [This Person Does Not Exist](https://uifaces.co/tpdne-plugin) — add computer-generated photos of fictional people to your mockups. This plugin uses the thispersondoesnotexist.com website by Nvidia as a source for the photos and images.weserv.nl as a proxy and resizes tool. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Lorem Ipsum](https://xdplugins.pabloklaschka.de/support#Lorem) — a small plugin to insert placeholder text that fits your needs. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Wikify](https://nurecas.com/wikify-a-plugin-for-adobe-xd) — a plugin with which you can populate fields with Wikipedia content. Select a text field or an image container or both, run the plugin and type in what content you want to populate the fields with. Enjoy! (Please note that the licenses of the content have to be acquired and used separately.) ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Movie Posters](jakovcevski@gmail.com) — import movie posters in your designs with a click. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [uilogos](https://github.com/realvjy/uilogos-XD) — uiLogos allow you to Insert professionally designed dummy logos of company and 190+ Country flags directly into mockup. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [User Images](mail@dpandey.com.np) — this plugin fills selected shapes with random user photos using randouser.me's API. Plugin needs internet connection on your machine to work. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Airtable](https://support.airtable.com/hc/en-us/articles/360009887334) — forget lorem ipsum: iterate with real content in your designs when you connect Adobe XD to an Airtable database of UI copy, images, and more. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Google Sheets](https://googlesheetsforadobexd.impekable.com) — a plugin that enables designers within XD to enrich their designs with real content and data from Google Sheets. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [ContentGenerator](andreea.marica11@yahoo.com) — a content Generator plugin helps you generate randomised content for your design. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Data Populator](feedback@datapopulator.com) — a plugin to populate your design mockups with meaningful data. Goodbye Lorem Ipsum. Hello JSON. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [QR Code Maker for XD](agata@chuwa-print.co.jp) — create QR Code in the ​current document. This plugin will work 8 bit binary mode with UTF-8. The error level will set low. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [UI Faces](https://uifaces.co) — avatars for design mockups. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Developers Handoff * [Sketch Measure](https://github.com/utom/sketch-measure) — make it fun to create a spec for developers and teammates! Automatically generating html page with one click, inspect all the design details including CSS Styles on it offline. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Marketch](http://tudou527.github.io/marketch/) — a Sketch 3 plug-in for automatically generating html page that can measure and get CSS styles on it. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sympli](https://sympli.io) — perfect your collaboration with Sympli. Share specs and assets, then inspect designs and make pixel-perfect apps faster online or with plugins for Android Studio and Xcode. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Avocode Sketch Plugin](https://avocode.com/download?origin=sketch) — sync Sketch designs to Avocode. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Inker8](https://github.com/inker8/sketch-plugin) — a spec exporter for Sketch which can copy text/css/svg icons with only one click. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Storyboard](https://github.com/BriteSnow/sketch-storyboard) — export a full story flow and dev spec in one shortcut. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SwiftColorPalette](https://github.com/nahitheper/SwiftColorPalette) — a Sketch plugin that generates Swift Color Theme with enums ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Mockplus iDoc](https://idoc.mockplus.com/download/sketch) — generating Assets and Specs Automatically, Make Design Collaboration Easier ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Lanhu App](https://lanhuapp.com/mac) — automatic generate specs for developers and share assets ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [AEIconizer](https://github.com/tadija/AEIconizer) — iOS icon generator plugin for Bohemian Coding Sketch app. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Zeplin](https://zeplin.io) — a Zeplin Sketch Plugin. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [MockingBot](https://modao.cc/sketch) — MockingBot Sketch Plugin, Your sweet Sketch companion making your handoff process more efficient than ever ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Figma Measure](https://www.figma.com/c/plugin/739918456607459153) — a plugin for easy measurement of sizes. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [inker8](https://github.com/inker8/xd-plugin) — export design spec to measure positions, copy CSS and export icons. Make writing CSS and UI fun. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Document Optimisation * [File Cleaner](https://github.com/monzo/file-cleaner) — keep your Sketch files immaculately clean and in order. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SketchCleaner](http://www.sketchcleaner.com/) — a Sketch plugin that helps you get your design files as clean as a whistle. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Pixel Perfecter](https://github.com/swiadek/pixel-perfecter-sketch-plugin) — pixel-perfecter helps you find pixel imperfect layers in your documents. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Pixel Cleanup](https://github.com/stackdevelopment/sketch-pixel-cleanup) — a plugin for Sketch to fix all of those partial pixels ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Cleanup Useless Groups](https://github.com/bomberstudios/Cleanup-Useless-Groups) — a Sketch plugin that cleans up your layer list by removing empty groups and flattening deeply nested groups. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Mise En Place](https://github.com/madwaro/MiseEnPlace) — a Sketch plug-in that helps you prep before you start cooking your designs. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Unused Style Remover](https://github.com/sonburn/unused-style-remover) — remove the unused layer and text styles. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Remove all Disabled Styles](https://github.com/ErikFontanel/sketch-remove-all-disabled-styles) — a simple plugin that removes all disabled styles from all layers in the current selection. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Delete Hidden Layers](https://www.figma.com/c/plugin/750292779381900360) — delete all hidden layers (also locked) at the current page except layers in components. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg)
### Document Organisation * [Annotations](https://github.com/BaguetteEngineering/annotations-sketch-plugin) — Hide/show layer groups named 'Annotations'. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Context for Sketch](https://getcontext.app) — Add to your document pins linking to prototypes, inspirations, examples or anything else on the web. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Notebook](http://marcosvid.al/sketch-notebook) — Sketch Plugin to make documenting design easier. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Todo Sketch Plugin](https://github.com/andrewdbass/Todo-Sketch-Plugin) — simple tool to create todo notes for your sketch file ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Moodboard Builder ](http://reinvently.com/moodboard-builder-sketch-plugin/) — A streamlined Sketch plugin for creating mood boards quickly and easily. Just do a search, check the suitable images, and - voila - you have a beautiful mood board. Keep inspired! 💡 ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Notes](https://github.com/cshdllr/Notes) — A sketch plugin for taking notes ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Focus](https://sketchfocus.com) — A new plugin for Sketch that boosts your productivity by keeping you on-task. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Changelog](https://github.com/jacopocolo/changelog.sketchplugin) — A simple Sketch plugin to generate artboard-based changelogs ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [PinLog](https://github.com/zhongerxin/PinLog) — A plugin that would help you note your changeLog and can help other people to find the change in sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Todo](https://www.figma.com/c/plugin/747822968977461925) — Simple todo list plugin to check off your tasks inside Figma! ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Notepad](https://www.figma.com/c/plugin/739527655081183968) — Use Notepad to add a place for notes to your Figma documents. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Figma Format](https://www.figma.com/c/plugin/732774680197470712) — lets you format your canvas by grouping them by the names. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [LayerMaid](https://www.figma.com/c/plugin/732617369306910191) — LayerMaid will go through the entire layer panel and organize it; top to bottom, left to right. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Project Scaffold](https://www.figma.com/c/plugin/747372158567878238) — This plugin Generates a Scaffold for your Product design project in just 1 click. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Link to Documentation](https://www.figma.com/c/plugin/748783469068559194) — Open documentation pages from your components. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [work in progress](https://www.figma.com/c/plugin/761641569499378065) — The plugin quickly marks layouts that are in work or don’t approve finally. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Visibility](https://www.figma.com/c/plugin/739089407370404321) — Changes the visibility of objects with a name that includes "~visibility" ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Page No](contact@starlit-studio.com) — Automatically insert page numbers into your artboards based on their arrangement. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Notes and Annotations](https://tourdexd.com/plugin/notes-and-annotations/) — With Notes and Annotations you can easily add interactive notes based on provided templates or create your own look and feel. With two simple buttons, you can easily hide or show all notes in the entire document. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Bookmarks](https://www.derekknox.com/articles/bookmarks-adobe-xd-plugin) — Bookmark document zoom and pan locations.- Jump around large documents with ease- Jump to areas of interest when presenting designs, user flows, etc.- Jump to a bird's-eye view of all artboards in one view- Bookmarks persist in the document so they're shared with team members automatically- Nickname bookmarks for easier understanding of their zoom and pan location ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Layout & Padding * [Dynamic button plugin for Sketch.app 3.5](https://github.com/fuggfuggfugg/sketch-dynamic-button-3.5) — Dynamic button plug-in for Sketch.app 3.5 allows you to create buttons with fixed paddings no matter what text you add. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Dynamic Symbol Button](https://github.com/herrkris/sketch-dynamic-symbol-button) — Adds the ability to have dynamic symbol buttons that resizes when the text changes. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg * [Paddy](https://github.com/DWilliames/paddy-sketch-plugin) — Automated padding, spacing, and alignment for your Sketch layers ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Symbol Spacer Sketch Plugin](https://github.com/novemberfiveco/symbol-spacer-sketch-plugin) — Automatically resize spacing symbols to correct size when changing to a different one ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Relabel Button](https://github.com/kenmoore/Sketch-Relabel-Button) — Update a button's label and it gets resized automatically, preserving existing padding. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Auto Layout](https://animaapp.github.io/Auto-Layout/) — Responsive design inside Sketch. Design for all screen sizes on one artboard. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Constraints](https://github.com/bouchenoiremarc/Sketch-Constraints) — A plugin that integrates constraints in Sketch to layout layers. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Pixel Perfect](https://github.com/materik/sketchplugin-pixelperfect) — Plugin for Sketch for handling layout and sizing of layers automatically based on their names. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Compo](https://github.com/romashamin/compo-sketch) — Makes it easier to work with interface components in Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Toggle Constrain Proportions](https://github.com/ErikFontanel/sketch-toggle-constrain-proportions) — Toggles the constrain proportions setting with keyboard shortcut ⌘ + P. Sketch v39+ compatible. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Method](https://github.com/KikeSz/Method-Sketch-Plugin) — Tool to apply your methodology systems ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Flex Layout](https://github.com/hrescak/Sketch-Flex-Layout) — Plugin for Sketch allowing for CSS Flexbox layouts using stylesheets and prototypes. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Viewports](https://www.figma.com/c/plugin/732240841094697441) — Make sure that your mobile designs are covering a reasonable share of the market! Select one or more frames and Viewports will let you change their sizes to your preferred device. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Paddet](https://www.figma.com/c/plugin/734548932196004433) — Paddet is a small tool that will help you automatically apply padding to frames. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Responsify](https://www.figma.com/c/plugin/743654854885744527) — A Figma plugin to quickly test your designs across multiple device sizes. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Dynamic Component Resizer](https://www.figma.com/c/plugin/734140091470043718) — With this plugin, you'll be able to setup components and resize their instances while maintaining the spacings that you've set in the master. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Paddi](https://www.figma.com/c/plugin/746314565953874339) — Paddi helps you to set paddings for a Group, a Frame, or a Component. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [AutoLayout](https://www.figma.com/c/plugin/755300155155835622) — AutoLayout dynamically lays out layers in frames and updates the layout when the dimensions of child layers change. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Stacks](https://www.figma.com/c/plugin/745754288876102954) — Stacks provide extensive, semi-automated control over the spacing, direction, and alignment of layers. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg)
### Export * [Sketch Slicer](https://github.com/d4rekanguok/sketch-slicer) — Create slice layers from selected layers, with padding or set a fixed size. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [slicer](https://github.com/ozzik/slicer) — Your friendly Sketch slicing helper ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Design Token Exporter](https://github.com/here-erhe/Design-Token-Exporter) — Simple Design Token Exporter ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [sketch-export-to](https://github.com/mascardoso/sketch-export) — Export an artboard layer to json or markdown ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [slice-it](https://github.com/deepakshrma/sketch-slice-it) — Slice-it tool, Export the slices from the local sketch file in png, jpeg, svg ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Drafta](https://github.com/fragmentlv/drafta) — Export designs directly to Drafta ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Caravel](https://github.com/CaravelDesign/caravel.sketchplugin) — Export your artboards directly to Caravel projects. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Squash](https://github.com/mcansh/squash-sketchplugin) — Export and optimize images with Realmac Squash ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [ImageOptim Sketch Plugin](https://github.com/ImageOptim/sketch-plugin) — A Plugin for Sketch that compresses exported images using ImageOptim. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Export Symbols](https://github.com/marianomike/sketch-exportsymbols) — Sketch Plugin that exports all symbols as pngs to a specified folder ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Android Res Export](https://github.com/Ashung/Android_Res_Export) — Export Android resources in Sketch, include PNG assets, app icon, nine-patch image and vector drawable. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Atomic Sketch Plugin](https://atomic.io/sketch) — Exports Sketch Files to Atomic ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Base64 PNG Export](https://github.com/jawayang/Sketch-Base64-PNG-Export) — sketch plugin for Export Data URI ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [IconSlate](https://github.com/kodlian/IconSlate-sketchplugin) — Export icons (icns,ico,...) from Sketch using Icon Slate. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Export to Indigo](https://indigo.infragistics.com/sketch-home) — Generate Indigo Studio projects from your artboards to create interactive, animated prototypes. Get real user feedback through included usability studies with video replays. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [sendTo](https://github.com/udi-gindi/sendTo) — Export layer as an email attachment ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Page Export](https://github.com/charliecm/sketch-page-export) — A simple Sketch plugin for exporting page(s). ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Gretel](https://github.com/StyleShare/Gretel) — A Sketch plugin that flattens files after exporting. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [ImageCodeExporter](https://github.com/funfungo/ImageCodeExporter) — a plugin that exports your sketch layer for code usage ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SVG-BEM](https://github.com/mLihs/svg-bem) — a plugin for SVG export to convert IDs to Classes, create BEM Styled Naming Based on Layers. Uses SVGO to compress and Clean up SVGs, right when you export them. Based on the SVGO Compressor Plugin ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [rename-export](https://github.com/TheSonOfThomp/Batch-Export-Rename) — Use this plugin to batch export layers with consistent filenames ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Somino](https://github.com/melsomino/sketch-somino) — Attachable styles, Advanced clipboard, Silent export ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Lottie Sketch Export](https://github.com/buba447/Lottie-Sketch-Export) — Native Sketch plugin for exporting Artboards and Symbols into Lottie JSON ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Awesome Image Compressor](https://github.com/naoyawatanabe/awesome-image-compressor) — Compress exported image assets ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Image Compressor](https://github.com/BohemianCoding/sketch-image-compressor) — A Plugin that compresses bitmap assets, right when you export them. This Plugin *requires* Sketch 3.8. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Nucleus](https://github.com/levtolstoi/Nucleus) — Plugin for creating Atomic Design concept in Sketch and export scss-map for front-end ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [sketch2vd](https://github.com/alexjlockwood/sketch2vd) — A Sketch plugin that exports selected layers to VectorDrawable for Android. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SVGO Export](https://github.com/josephmcasey/sketch-plugin-svgo-unique-id) — Uses SVGO to compress exported SVG assets ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Icon Tools](https://github.com/oodesign/icon-tools) — Sketch.app plugin to clean icons and to prepare them for a clean export without tints and masks. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [giancartboard](https://github.com/MattCowBoy/giancartboard) — Sketch plugin to export artboards in folders automatically numbered ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sync To Slides](https://websiddu.github.io/sync-to-slides/) — Sync to Slides is a Sketch plugin that will help you upload your artboards to Google Slides directly without an export step ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Justinmind Sketch](https://github.com/vconesa/justinmind-sketch) — You can export artboards, layers, and pages you’ve made in Sketch to Justinmind and turn them into interactive shareable prototypes. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch2AE](https://github.com/bigxixi/Sketch2AE) — A Sketch plugin to export sketch file to Adobe After Effect ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [App Asset Export](https://github.com/work4blue/sketch-app-asset-export) — Sketch3 plugin, One key export Android/iOS App icons. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Export More](https://github.com/nathco/Export-More) — Sketch.app plugin for exporting ICNS and GIFs ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Shared Text Styles](https://github.com/nilshoenson/shared-text-styles) — Easily import and export your Text Styles in Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sheetie](https://github.com/JoeManto/Sheetie) — Sketch 3 Plugin that makes a SpriteSheets to export or use ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [ScreenFork](https://github.com/screenfork/ScreenFork) — ScreenFork is the Sketchapp plugin that export screens and their variants based on Layer prefix ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SVGO Compressor](https://sketchapp.com/extensions/plugins/svgo-compressor/) — A Plugin that compresses SVG assets using SVGO, right when you export them. This Plugin requires Sketch 3.8. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Export Generator](https://github.com/kang-chen/sketch-export-generator) — Sketch plugin to export assets at different scale sizes ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Export to Proto.io](https://proto.io) — Give life to your Sketch designs! Export all or selected artboards to Proto.io screens, preserving layer positioning and hierarchy. By exporting to Proto.io you can link screens together, add interactions and animations. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Export Sizes Generator](https://github.com/devxoul/sketch-export-sizes-generator) — A simple plugin for Sketch that generates export sizes of layers. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [ScrollMotion](https://github.com/jonmmay/sketch-scrollmotion) — Sketch plugin to export ScrollMotion ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Export for Replia](https://github.com/bunguu/SketchExportForRepliaPlugin) — Sketch Plugins to export selected artboard or layers for Replia. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Xport](https://github.com/abynim/Xport) — A Sketch Plugin to export image assets directly to Xcode ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Better Android Export](https://github.com/nickstamas/Sketch-Better-Android-Export) — A plugin for exporting layers for Android. Supports transparency and 1x and 2x base sizes. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [smartboards](https://github.com/elihorne/smartboards) — Smartboards aims to make managing and exporting artboards easier in Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Export Assets](https://github.com/GeertWille/sketch-export-assets) — A Sketch plugin that allows you to quickly export assets for Android, iOS, Windows Phone, and the Web. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Clear Export Options](https://github.com/emrerussia/sketch-clear-export-options) — Clear export options for all elements on all pages in a Sketch file. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Timeline](https://timeline.animaapp.com) — Create beautiful timeline animations and export GIF or MP4 ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Quick Export as PNG](https://github.com/richardgazdik/sketch-quickexport) — Quick Export layers/artboards/symbols as PNG Plugin for Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Seca](https://github.com/iGenius-Srl/Seca) — Your friendly Sketch slicing helper for symbols ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [library-audit](https://github.com/naughtandcross/sketch-library-audit) — Export Symbol and Shared Style data from any Sketch Library to CSV. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Miro plugin for Sketch](https://github.com/RealtimeBoard/sketch_plugin) — Add, share and discuss your Sketch artboards with the team in Miro (formerly RealtimeBoard). The plugin allows to sync the artboards with the boards in one click ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SketchingOn](https://www.workingon.co) — Quickly select and share work in progress with your team via WorkingOn. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [zeroheight](https://zeroheight.com) — Document your design system using beautifully simple style guides synced with Sketch and code ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Droplr](https://droplr.com/integrations/sketch/) — Droplr for Sketch lets designers quickly and easily share their Artboards ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [PhraseApp Sketch Plugin](https://phraseapp.com/sketch) — Sync your design content from Sketch with PhraseApp ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Snatch](https://github.com/ZhichengChen/snatch) — Sketch plugin which uploads layer to CDN directly. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Storyboard Export](https://github.com/cranksoftwaredev/SketchPlugins) — Export Sketch based designs to be used within Crank Software's Storyboard Suite ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch to Trello](https://github.com/jclappiway/sketch-to-trello) — Export Sketch Artboard to Trello ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Upload to CloudApp](https://github.com/delighted/sketch-upload-to-cloudapp) — Upload to CloudApp: Upload the current artboard or page to CloudApp. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Framer Inventory 2.0 for Sketch](http://timurnurutdinov.github.io/framerinventory/) — Sketch plugin to generate FramerJS prototypes. Just have your motion done. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [WeTransfer](https://github.com/WeTransfer/Sketch-Plugin) — Share artboards and pages via WeTransfer ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Hubble Sketch Plugin](https://github.com/inthepocket/hubble-sketch-plugin) — A Sketch plugin to extract assets and primitives and send them to Hubble.app ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Dribbble](https://github.com/dribbble/dribbble-sketch) — Share your creative process directly to the Dribbble community from within Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [AEUX](https://github.com/google/sketch2ae) — Transfer layer to After Effects ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [projecthuddle](https://github.com/ajgagnon/projecthuddle-sketch-sync) — Syncs sketch files with ProjectHuddle mockup projects. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch TinyPng compressor](https://github.com/alxrm/sketch-tinypng-compressor) — A Plugin that compresses bitmap assets using TinyPNG API. This Plugin *requires* Sketch 3.8. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Coffee Slice](https://github.com/KivyGogh/coffee-slice) — A Sketch plugin to make the standard slicing with a user-given viewBox size automatically and creating multiple sizes(1x/2x/3x) of your slices, you can choose to autosave in a path or not. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Specify (Alpha)](https://specifyapp.com) — Export styles and assets to your Specify Libraries. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Advanced SVG Export](https://www.figma.com/c/plugin/782713260363070260) — optimize SVG before exporting without leaving Figma. Uses SVGO under the hood. ![figma.svg] * [Android Resources Export](https://www.figma.com/c/plugin/735452896889481850) — Export multiple sizes PNG from a selected slice or exportable layer, with a fixed folder structure (drawable-xhdpi, etc..) and valid name. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [iOS Export Settings](https://www.figma.com/c/plugin/747172434405306948) — This plugin automatically applies the correct export settings for every required iOS App Icon size and density. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [iOSPNGExporter](https://www.figma.com/c/plugin/745898698224781628) — This plugin helps you to create the most common used export settings for iOS PNG icons, including a @2x size and a @3x size. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [icns/ico Generator](https://www.figma.com/c/plugin/742318143106037364) — A Figma plugin to export Frame nodes to .ico (Windows) and/or .icns (Mac) files. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Export .zip](https://www.figma.com/c/plugin/747228167548695118) — Easily export assets from Figma directly into a .zip file. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Archiver](https://www.figma.com/c/plugin/738907708841687244) — Archiving frames within a design lifecycle is good practice to ensure that design assets are not lost, while also not getting in the way of current work. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Slicer](https://www.figma.com/c/plugin/755582372562882351) — A Figma plugin to make easier to slice multiple objects. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Justinmind for XD](https://www.justinmind.com/community/) — Bring your artboards, pages and layers to Justinmind, and turn your designs into an interactive, shareable prototype. Compatible with Justinmind version 8.6 and up. Once exported the resulting file can be opened with the Justinmind application available at www.justinmind.com ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Copy SVG Code](https://github.com/stursby/xd-copy-svg-code-plugin/issues) — Plugin to generate SVG code from the selection. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Advanced Export](https://t.me/savedata_space) — this plugin provide code from xd for developers - Colors For Android,CSS,LESS,SCSS - Artboard mockup for Xaml - Name of Artboards ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [UWP icons export](http://misjavansitteren.nl/) — Create assets / icons for UWP in the formats 100, 125, 150, 200, and 400. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Export as React Component](https://bitbucket.org/joeherold/export-react/issues) — Select elements and or groups in your artboard, and export them as react functional components. Name of Group / Element ist the Component Name. (AppIcon => AppIconComponent.js) ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Export only one size](https://github.com/nikoladev/xd-export/) — Do you ever need to export something at 3x scale and then find yourself deleting all the 1x and 2x versions? This plugin lets you choose a scale to export at and then only exports at that scale. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [XDA Exporter](https://github.com/teach310/Xd2uGUI) — Export Artboard Info as xda.You can use xda file to any other soft to generate screen. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Dribbble](https://dribbble.com/contact) — The Dribbble plugin allows you to share your creative process directly to the Dribbble community without ever leaving Adobe XD. Post on behalf of yourself or your team, schedule shots, and more. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [CloudApp](support@getcloudapp.com) — CloudApp's Adobe XD plugin is the quickest way to share screenshots of artboards and assets without leaving XD. Capture your work with a secure and shareable link for accelerated collaboration with both clients and colleagues. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Custom Export](hi@chrometaphore.com) — Export selected Layers and Artboards to any custom scale. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Trello](https://docs.google.com/forms/d/e/1FAIpQLSeRCfX71_Fg6RVvS-x9IFXFkDnmHgqBwbBYH9wbP-uOqDKp2g/viewform) — Easily send XD assets to Trello. Share artboards and layers with your team without leaving XD. Trello's simple visual interface helps you manage creative tasks with ease. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Sisense Blox Template](https://support.sisense.com) — Create Sisense BloX JSON template by selecting your designed items then Ctrl-option-C on Mac and Ctrl-alt-C on a PC, then paste it on Sisense+BloX and you are done!. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Artboard Deep Link](alexdobras@gmail.com) — Fast obtain the exact web link (URL) of the selected artboard for you to paste it in a browser to see your project directly opening at that. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Artboard for PDF](shingo2000@gmail.com) — Create artboards for exporting as PDF files. You Can Select Size (A3 - B5) and Orientation (Landscape or Portrait). ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [XD2Sketch](https://xd2sketch.com) — Export XD files directly to Sketch using our converter. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Generate UI Element * [Radial Lines](https://github.com/herrhelms/radial-lines-sketch) — Generate lines originating from a certain coordinate of an artboard. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Super Shapes](https://github.com/sureskumar/super-shapes) — Generate complex organic super-shapes using super formula. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [6Spiral](https://github.com/matej-marjanovic/6Spiral-Sketch-Plugin) — 6Spiral is a sketch plugin to draw spiral shapes (archimedean and logarithmic spirals) and it also allows you to convert the 2D spirals into 3D-like helix shapes at a specified isometric angle. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Tiles](https://github.com/kumo/sketch-tiles) — A Sketch plugin for playing with seamless tiles. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Mosaic](https://github.com/tomorrowkey/sketch3-mosaic-plugin) — A plugin for Sketch3 to apply mosaic easily. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Egmont Plugin](https://github.com/interfacemarket/Egmont-plugin) — Sketch plugin for creating squircle shapes. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Skatter](https://github.com/joshdjuric/Skatter) — A plugin with tools (currently very basic tools) to assist with creating patterns out of shapes. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [triangle-field](https://github.com/0la0/triangle-fields) — Generate Delaunay triangle tessellation inside a shape. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch QR Code](https://github.com/lerte/sketch-qr-code) — A Plugin for generating SVG QR Code in the Sketch app. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Blobs](https://www.figma.com/c/plugin/739208439270091369) — Create organic blob shapes with the click of a button. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Isometric](https://www.figma.com/c/plugin/741184519069077841) — Isometric allows you to create isometric layers without manually having to set them up. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Pattern Hero](https://www.figma.com/c/plugin/740556241021336678) — Pattern Hero enables you to place selected elements or frames in a grid to create patterns. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Get Waves](https://www.figma.com/c/plugin/745619465174154496) — Get Waves is a free SVG wave generator to make unique SVG waves for your next design. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Make blob](https://www.figma.com/c/plugin/740172168964577201) — Make blob and add it on your page. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Sprinkle](https://www.figma.com/c/plugin/734501601239074381) — Make it rain with confetti. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Confetti](http://www.sketchconfetti.com) — Confetti for Figma lets anyone create gorgeous confetti patterns. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Metaball](https://www.figma.com/c/plugin/743754408199479204) — Metaball plugin generates 2D-Metaball shapes from circle objects. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Wave & Сurve](https://www.figma.com/c/plugin/745971189153303901) — With "Wave & Surve" you can easily create a variety of waves and interesting patterns. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Random layout generator](https://www.figma.com/c/plugin/755525134262262553) — An inadequate tool for randomly generating endless layouts. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Squiggly](https://www.figma.com/c/plugin/753395020416512502) — A plugin for generating squiggles. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Button Generator](https://www.figma.com/c/plugin/750298912003944521) — Button Generator does what it says on the box, it generates button components with no fuss. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Flutter Icon Generator](https://medium.com/@tamjeed) — Generates the App Icons for a given Flutter project. Select the root folder of the flutter app to have Android and iOS App icon generated. The selected object in Adobe XD should be of 100x100 size ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [triangle](kenny.krosky@gmail.com) — Quickly add triangle elements to your design that you can customize the stroke - stroke width - stroke color - fill color. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [regular polygon](yuji.arai@romantist.jp) — It is a plugin that draws a regular polygon ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [star shape plugin](http://romantist.jp/blog/star-shape) — It is a plug-in that draws star-shaped figures. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Widgets for XD](n.bhargavvenky@gmail.com) — Widgets for XD is a great plugin that creates commonly seen plugins in smartphones with a single click or a shortcut ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Guides & Grids * [Evenly Distributed Guides](https://github.com/herrhelms/even-guides-sketch) — Add evenly distributed guides to artboards. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Gridy](https://github.com/Volorf/Gridy) — An easy way of creating guidelines ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Remove All Guides](https://github.com/ichik/removeallguides) — Removes all the guides from selected artboards. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Copy & Paste Guides](https://github.com/pixelpillow/copy-paste-guides) — Easily copy, paste or remove guides from/to your artboard(s). ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Bootstrap Guides](https://github.com/tomoyukikashiro/Sketch-bootstrap-guides) — Generate guides along with twitter bootstrap grid system. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Guides](https://github.com/luvmex/Sketch-Guides) — Add Guides to edges and midpoints at once. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Ps Guides](https://github.com/pratikjshah/PS-Guides) — Quickly generate Guides for a selected element in Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Bootstrap Grid](https://github.com/De-La-Vega/BootstrapGrid) — Sketch plugin inserts the correct bootstrap grid in nested blocks. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Guides](http://guides.pratikshah.website/) — Quickly generate Guides for a selected element in Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [GuideGuide](https://guideguide.me) — Quickly and easily create grids and manipulate guides with a consistent UI in Photoshop, Illustrator, and Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Gutter Cutter](https://github.com/GCampi/gutter-cutter) — A Sketch plugin to create custom grids with guides ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Grid Layer](https://github.com/franklymrshankly/Grid-Layer) — Create columns or gutters as layers. Useful if you need a grid on a component level. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Grid Master](https://github.com/exevil/sketch-grid-master) — Grid Master is a Sketch plugin that fixes long-standing bugs and adds new functionality related to work with Grid and Layout. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Guide Mate](https://www.figma.com/c/plugin/739342962452731553) — Guide Mate is a Figma plugin that helps you add complex guides to your design with ease. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Clear Guides](https://www.figma.com/c/plugin/753903260307779121) — Clears guides! If you have one or more frames selected it will clear the guides in those frames. If there is nothing selected, it will clear the guides on the current page. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Grids Plus](https://sugarsweetapps.com/contact/?utm_source=Plugin&utm_medium=Direct&utm_campaign=Contact%20Page%20Before%20Installation) — The Only Grid Plugin That Focuses On Work Ready Pixel Perfect Grids CreationGrids Plus+ focuses on usable grids, grids that are pixel perfect (no decimals XX.241 grid placements), it takes the same approach. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [RepeatGrid Fitter](https://paper.dropbox.com/doc/Repeat-Grid-Fitter-Support--APqpBnFaWjjO6cjwiwV0SpPXAQ-bG0aYLxvVgVpth0tJjkhC) — It makes a repeat grid's size fix to fit the rows and the columns. And you can hide some items. for example, 2(rows) by 4(columns) equals 8 (items). but only 6 items shown. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Images Management * [Place Linked Bitmap](https://github.com/frankko/Place-Linked-Bitmap) — A plugin to place external bitmap files into Sketch and update Sketch layers after external bitmaps are updated ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Replace Images](https://github.com/shakemno/sketch-replace-images) — Sketch 3 plugin to replace (as in update) existing images by name in a sketch document. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch User Flows](https://github.com/ribot/sketch-user-flow-docs) — This plugin lets you link images in a document with an external image file and update them all at once. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Clipboard Fill](https://github.com/ScottSavarie/Clipboard-Fill) — Sketch plugin to paste an image from your clipboard as the fill for any shape ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [ImageExtractorSketch](https://github.com/mendyismyname/ImageExtractorSketch) — Extract background fill image in Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Image Replaste](https://github.com/mheesakkers/sketch-image-replaste) — A simple Sketch plugin for replacing images with the copied image of your clipboard. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Images Reinvented](https://github.com/roydigerhund/Images-Reinvented) — A better way to use images in Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Reset Image Aspect Ratio](https://github.com/perrysmotors/reset-image-aspect-ratio) — A Sketch plugin that resets the aspect ratio of selected images. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Advanced Responsive Images Default](https://github.com/Nkzq/advanced-responsive-images-default) — Generate default images according to the sizes given. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Spooky](https://github.com/eliasjulian/spooky-sketch) — Is this image spooky enough? You'll never have to ask yourself that question again. Happy Halloween! ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Image tracer](https://www.figma.com/c/plugin/735707089415755407) — traces black & white bitmap images, and turns them into a vector layer. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Dither](https://www.figma.com/c/plugin/752462766270432644) — Add dithering effects to your images right there in Figma. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Autocrop](https://www.figma.com/c/plugin/740702788263758004) — Automatically crop the extra space surrounding an image. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Image Optimizer](https://github.com/irajashekarb/Image-Optimizer) — Image Optimizer is a compression tool that lets designers compress the images within Adobe XD. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Tunda Image](satriamaxt@gmail.com) — With Tunda Image you can place any image at the internet to your shape via the direct image or you can place any image in google image to your shape just copy the image address in your browser and paste it to Tunda Image and the image will be placed to your shape. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Masked Image Shadows](https://github.com/jonenzl/xd-masked-image-shadows/issues) — Quickly and easily add drop shadows to masked images. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Image minify](https://github.com/shingo2000/xd-plugin-image-minify) — Image minify reduces the image quality and resolution of the image layer. By optimizing the image used, it reduces the file size when exporting to a PDF file. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Pixabay image finder](jeanpr117@gmail.com) — Give me words and I'll give you pixabay images. Simple! Shortcut: Ctrl+Shift+I ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Import

Abstract

* [Stash](https://www.stash.diamonds) — Import artboards from Stash to Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Bolt](http://boltplugin.com/) — Import screenshots faster ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Import SVG as Artboards](https://github.com/mathieudutour/import-svg-as-artboard) — Import SVG files as Artboards. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Envato Elements](https://github.com/envato/extensions-sketch-plugin) — Envato Elements Sketch plugin makes it easy to import a select range of Web and Mobile UI Kits from Envato Elements! ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SVG Insert](https://github.com/tankxu/SVG-Insert) — Insert SVG code as a Layer. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Android Screenshot](https://github.com/sylvainleris/fr.y3s.sketch.screenshot) — A Sketch plugin to take screenshots of Android device connected over USB. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [PasteSVG](https://www.figma.com/c/plugin/740559260731517035) — This plugin allows you to convert svg code into icon and put it inside the figma. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Tailwind CSS](https://www.figma.com/c/plugin/738806869514947558) — Generate styles and other cool stuff straight out of your tailwind config file? This plugin already supports adding your color styles and has more features coming up in the future. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [HTML To Figma](https://www.figma.com/c/plugin/747985167520967365) — Easily convert any webpage to Figma layers by URL. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [SVG to JSX](https://www.figma.com/c/plugin/749818562498396194) — This plugin allows you to copy SVG code as a react component so that you don't have to transform it. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [PPT for XD](https://twitter.com/dvrvrm) — Converts XD files to PPT file with images. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Inspect](https://www.unykvis.com/en/contactos) — Inspect allow you to collect images, colors, styles and other information from you site. Now you no longer need to leave Adobe XD to inspect a website. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Mimic](https://tourdexd.com/plugin/mimic/) — Extract colors, font names and images from the web. Useful plugin to kickstart designs based off of something out in the wild. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Map Generation * [Map Creator for Sketch](https://github.com/terence55/sketch-map-creator) — Plugin to visually create a static map(BaiduMap, MapBox, GoogleMap) with custom options, and location search is available now ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Maps](https://github.com/bouchenoiremarc/Sketch-Maps) — A Sketch plugin that uses the Mapbox API to fill layers with specific and custom maps. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Map Generator](https://github.com/eddiesigner/sketch-map-generator) — Plugin to fill a layer with a map generated from a location (Powered by Google Maps) ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Mapsicle](https://www.figma.com/c/plugin/736458162635847353) — With Mapsicle, you can quickly and seamlessly place maps in your mockups. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Map Maker](https://www.figma.com/c/plugin/731312569747199418) — Map Maker allows you to make a customized map blazing fast. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Maps generator](https://github.com/boopeshmahendran/AdobeXD-maps/blob/master/README.md) — Generate maps using the Google Maps API. Enter a place name or latitude and longitude and click Generate Map. It's that simple! You can also change the Map Type, Zoom Level and add Custom Styles. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Mockup Plugins * [Artboard Studio Mockups](https://www.figma.com/c/plugin/750673765607708804/Artboard-Studio-Mockups) — Get access to more than 5300 world-class quality Artboard Studio mockup items right inside your Figma files. Easily render Figma frames into real-life product mockups with a click of a button. More items are added to our ever-growing library every day. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg)
### Other * [Tabula Rasa](https://github.com/avk/sketch-tabula-rasa) — Add blank backgrounds to transparent artboards ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Remove.bg](https://github.com/mathieudutour/sketch-remove-bg) — Remove image background in a single click ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Label Layers](https://github.com/franklymrshankly/Label_Layers) — A Sketch plugin that labels selected layers ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [sketch-camera-hotkeys](https://github.com/jayhxmo/sketch-camera-hotkeys) — Navigate around and present more efficiently ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch a Sketch](https://github.com/mathieudutour/sketch-a-sketch) — Bringing the iconic knobs from the famous toy to Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Line2rect](https://github.com/KevinvBre/Sketch-Line2Rect) — Replace Lines by Rectangles in Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Composite SVG](https://github.com/alanfraneo/svg-composite) — A Sketch plugin to create a composite SVG file from sketch artboards ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [toggleLayers](https://github.com/KevinGutowski/toggleLayers) — One action to toggle layers on / off so that you can more easily remap this to a custom keyboard shortcut. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [lazyboards](https://github.com/lazybearcreations/sketch-lazyboards) — Artboard tools to help you with tedious batch tasks. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Replace Layer](https://github.com/daneden/sketch-replace-layer) — Replace selected layer(s) with copied content/layer(s) ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Puzzle Tokens](https://github.com/ingrammicro/puzzle-tokens) — Sketch.app plugin to apply design tokens to Sketch layers ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Iconscope](https://github.com/ziven27/Sketch-IconScope) — Wrap the Icon with a square(4n) scope. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Roller](https://github.com/toyboxsystems/roller) — Roller is the first Linter for Designers. It works just like spell-check but within your Sketch files. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Assistant](https://github.com/jordansinger/Assistant) — Talk to Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Y Tools](https://github.com/yued-fe/y-tools) — Sketch plugin tools yued-fe.TM ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Lightwire](https://github.com/alex-matt/sketch-lightwire-plugin) — Plugin with ready-to-use wireframes that help you to bring your ideas to life fast and easy. You can find necessary wireframes using categories or search. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Perfecto-](https://github.com/pranusarna94/Perfecto-) — A sketch plugin to round off all sub-pixel layers at once ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [draw-and-render](https://github.com/nichenqin/draw-and-render-sketch-plugin) — A plugin to render canvas to sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Split Shape](https://github.com/kupe517/sketch-split-shape) — Sketch plugin to split up a rectangle evenly by a user-generated value ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Separate Shapes](https://github.com/PEZ/SketchSeparateShapes) — A Sketch-app plugin that does a ”boolean” separate operation on two selected shapes. Like divide in Pathfinder in Adobe Illustrator. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Topographic](https://github.com/ziven27/Sketch-topographic) — Display Topographic Information ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Units](https://github.com/dploeger/sketch-plugin-units) — A Sketch plugin for working with print units (inch, cm, mm) in Sketch's pixel world. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Z Rating](https://github.com/pranusarna94/z-rating) — Sketch plugin for designers @zomato to quickly change and maintain restaurant ratings ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Smartling](https://smartling.github.io/smartling-sketch-plugin/) — Plugin for Sketch that allows you to translate and pseudo-localize designs using the Smartling platform. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Gifmock For Sketch](https://github.com/stevenfabre/Gifmock-for-Sketch) — Easily create GIFs from your mocks ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Show Layer Info](https://github.com/MrPeak/sketch-show-layer-info) — Show selected layer's ObjectID, Class and ID. It is of great use for plugin development or file parsing. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Table of Contents](https://github.com/youwenliang/Table-of-Contents) — Sketch plugin for generating a table of contents for documentations ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Marginbox](https://github.com/FrancisVega/sketch-marginbox) — Simple script to create layers as margins ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Nudge Corner Radius](https://github.com/DWilliames/nudge-corner-radius-sketch-plugin) — Increase/decrease the corner radius of a rectangle, or path nodes — with easy keyboard shortcuts ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Rotate Artboard Orientation](https://github.com/mmilano/sketch-rotate-artboards) — Rotate the orientation of an artboard - from portrait to landscape, and vice versa. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch RTL](https://github.com/devinmancuso/sketch-rtl) — Automatically create RTL layouts of your designs with this plugin for Bohemian Coding's Sketch 3 ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Rotator](https://github.com/pberrecloth/rotator-sketch-plugin) — Rotate objects at preset amounts ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SketchTape](https://github.com/rjungemann/SketchTape.sketchplugin) — Connect two shapes in the Sketch app. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [webalize](https://github.com/Vesely/webalize) — Sketch plugin to webalize layers name. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch to VR](https://github.com/auxdesigner/Sketch-to-VR) — Personal fun project - turn your mocks into VR ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Specify](https://github.com/ElliotEKJ/specify) — Quickly generate a rectangle or oval with specific dimensions and positioning. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Wakatime](https://github.com/wakatime/sketch-wakatime) — A Plugin to update your WakaTime stats automatically from Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Formr](https://github.com/lessthanzero/Formr) — Helps to maintain simple proportions of layers and artboards ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Toggle NoPrint](https://github.com/sudilkovsky/Toggle-NoPrint-Visibility-Sketch-Plugin) — Toggle Visibility of 'NoPrint' layers in Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Unlock All Layers & Unlock Hover](https://github.com/truthlabs/sketch-unlock-all-layers) — Unlock all layers on the current artboard using ⌘⌥L ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Nearest 8](https://github.com/acollurafici/Sketch-Nearest-8) — Sketch Plugin to round shape size to the nearest multiple of 8 ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Split & Divide](https://github.com/KrevedAccky/SketchSplitDivide) — Split and Divide plugins for the Sketch3 app. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [WordCloud](https://github.com/ediathome/WordCloud) — Create basic word clouds and tag clouds. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Single Border](https://github.com/sureskumar/single-border) — Add single borders with advanced controls. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Play](http://sureskumar.com/sketchplay/) — Create game plays directly from the Sketch app. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Loose!](https://github.com/teeerevor/loose-sketch-plugin) — Turn your lines into arrows ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [QRCode for Sketch Local Sharing](https://github.com/dex1t/QRCode-for-Sketch-Local-Sharing) — This plugin show QR Code for Local Sharing URL (Sketch 3.4 Feature). Read this QR code when checking your design on a smartphone. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Library Replacer](https://github.com/BohemianCoding/library-replacer-sketchplugin) — Quickly replace instances of shared Symbols and Styles. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Install Library Bundle](https://github.com/bomberstudios/install-library-bundle) — Installs a bunch of shared Sketch Libraries at once, because life is too short for clicking links. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Remove BG](https://www.figma.com/c/plugin/738992712906748191) — Remove the background of images automatically with just a single click - using the remove.bg API. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Border](https://www.figma.com/c/plugin/740014625507871586) — Quickly add single borders in Frame. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Gifs](https://www.figma.com/c/plugin/748092648919348948) — Your perfect design needs the perfect gif. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Multiplayer Pong](https://www.figma.com/c/plugin/749261072790710247) — The first video game implemented as a Figma plugin is also the first video game ever: Pong. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Tumble](https://www.figma.com/c/plugin/736084415195819692) — Tumble makes shapes fall down. Put your shapes in a frame, select them and run Tumble. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Thanos UI](https://www.figma.com/c/plugin/751125845433636076) — Thanos UI removes random half of the selected elements. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Silicon Connector](support@siliconpublishing.com) — Silicon Connector for Adobe XD is a plugin that lets you access your Dropbox account from within Adobe XD. After authenticating with your username and password, you can navigate folders in your Dropbox account, search for assets, and use them in your designs. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Animated Digital Clock Timer](https://github.com/lelayf/AdobeXD-animated-digital-clock-timer) — This plugin lets you easily add custom animated countdown timers to your artboards using auto-animate transitions. It is useful if you design mobile apps that rely on time-based interactions supported by an actual timer or stopwatch in the UI. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [inMotion ignite](https://guide-ignite.inmotionnow.com/help) — Create inMotion ignite proofs from your artboards directly in Adobe XD! ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Move Items Dialog](https://onthehead.com) — Move items Like Illustrator Dialog. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### PDF Export Plugins * [PDF Export](https://github.com/DWilliames/PDF-export-sketch-plugin) — Export all pages, current page or selected artboards into a PDF — based on a range of settings ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Auto PDF Exporter nSlicer](https://github.com/Atim33/autopdfexporter-sketch-plugin/) — A Sketch Plugin to auto-export all '[S]' Prefix artboards to a single pdf. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Artboards to PDF](https://github.com/andrewfiorillo/sketch-artboards-to-pdf) — Sketch plugin to export artboards to PDF slideshow, from either the current page or from all pages ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Numbering Machine](https://github.com/akolpakov/sketch-numbering-machine) — Sketch plugin to generate IDs or Numbers for documents and export to PDF. Useful if you need to generate thousands of pages with the same template but with different IDs. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Print Export](https://github.com/BohemianCoding/print-export-sketchplugin) — Export artboards or pages to a PDF for printing ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg)
### Plugin Development

Abstract

* [Sketch DevTools](https://github.com/skpm/sketch-dev-tools) — See your plugin logs, inspect the state of Sketch documents, explore actions, and more ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Get It](https://www.figma.com/c/plugin/739958206151827292) — Get It helps in building Figma plugins by letting you prototype pieces of your plugin in Figma and copy their verbose syntax to your clipboard. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Inspector](https://www.figma.com/c/plugin/760351147138040099) — Speed up plugin development with an easy way to view and explore node properties. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Node Inspector](https://www.figma.com/c/plugin/758276196886757462) — View and copy node properties for plugin development. This plugin is only useful for plugin developers. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg)
### Plugin Managers * [SketchReloadPlugins](https://github.com/liangjingyang/SketchReloadPlugins) — Reload Plugins. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Plugin Reloader](https://github.com/TheNounProject/SketchPluginReloader) — A simple plugin to reload other plugins ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Plugin Monster](https://github.com/PeachScript/sketch-plugin-monster) — A Sketch plugin for managing all plugin shortcuts. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg)
### Plugins Collection * [Utility Belt](https://github.com/frankko/UtilityBelt) — An always-expanding collection of simple, focused plugins for Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Mate](https://github.com/getflourish/Sketch-Mate) — These plugins will make you best friends with Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Layer Tools](https://github.com/hrescak/Sketch-Layer-Tools) — A box for random useful sketch commands meant to make work with layers easier. It contains most of my previous commands and plugins combined, plus a bunch of new ones. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Commands](https://github.com/bomberstudios/sketch-commands) — A collection of script commands for Bohemian Coding's Sketch.app ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [ZEN Sketch](https://github.com/FrancisVega/ZEN-Sketch) — A collection of Sketch plugins ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Handy Tools](https://github.com/webpatch/Handy-Tools) — Some handy tools for Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Artboard Tricks](https://github.com/romannurik/Sketch-ArtboardTricks) — Artboard Tricks plugin for Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Automate Sketch](https://github.com/Ashung/Automate-Sketch) — Make Sketch more efficient. A lot of useful plugins in one. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Kitchen](https://github.com/ant-design/kitchen) — Make your design work delicious 🍽 ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SketchPlugins](https://github.com/eachandother/SketchPlugins) — Only contains a single plugin for the moment: Artboards to Pages. Takes all of the artboards on a page and create a new page for each of them, using the artboard name as the new page name. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Powerful Tools](https://www.figma.com/c/plugin/740040684939274087) — This plugin contains a couple of tools that empower you to fill your design with random dates, IDs, numbers, Chinese names or English names. It also includes a color palette and a mirror that connects an image to a certain frame. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Resco for XD](https://www.resco.net/contact-support/) — Resco for XD plugin is for users that use the customization tool, Woodford, by Resco. You can export images, create color themes and generate the main app icon for stores. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Presentation & Preview * [Timelapse](https://timelapsesketch.com) — Create beautiful high-speed videos of your work in Sketch and show off your progress. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Dockpreview](https://github.com/fnky/sketch-dockpreview) — A Sketch plugin that lets you preview your current artboard in the Dock. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Server](https://github.com/matt-curtis/Sketch-Server) — A Sketch Plugin that creates a local web server for your Sketch Documents. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [MagicPresenter](https://github.com/MagicSketch/MagicPresenter) — Sketch Plugin to Present Slides or Deck directly in Sketch 3 ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Browser Preview](https://github.com/lukasoppermann/browser-preview) — Quickly preview an artboard in your browser. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [represent.](https://getrepresent.com) — Present your UX/UI Designs lightning fast on the client's devices without leaving Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Preview](https://github.com/marcisme/sketch-preview) — This Sketch plugin provides a preview command (⌘P) that will open a specially named slice in Skala Preview. The plugin works by exporting the first slice named Preview to Sketch's cache directory and opening that file in Skala Preview. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Quick Presentation](https://github.com/timothywhalin/Sketch-Quick-Presentation) — A Sketch plugin to quickly share multiple artboards with an optional title. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Masker](https://www.figma.com/c/plugin/743170618365358883) — Masker allows you to easily overlay devices on selected layers in your project. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Autocover](https://www.figma.com/c/plugin/742583620684903056) — Figma currently creates a screenshot from the first page of your design document. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [File Thumbnails](https://www.figma.com/c/plugin/743199058431264556) — Create beautiful thumbnails for your projects to make your Figma file grid more convenient, fast and easier on the eyes. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Cover Generator](https://www.figma.com/c/plugin/745146759001708690) — A very simple plugin that takes a name, description, and status as input and generates a cover Image for your Figma file. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg)
### Prototyping * [Sketch Browser Preview](https://github.com/FreakLand/sketch-browser-preview) — Generates a preview (⌘ + ⇧ + .) of your current artboard and shows in your web browser. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [AnimateMate](https://github.com/Creatide/AnimateMate) — Create your animations directly in Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Prototypes Invision ↔︎ Sketch](https://github.com/mathieudutour/prototypes-invision-sketch) — Translate your prototyping links back and forth between Sketch and Invision ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Marvel Prototyping](https://www.figma.com/c/plugin/733702238760085035) — Seamlessly sync frames from Figma to new or existing Marvel projects, allowing you to quickly create prototypes or get audio and video feedback using our new User Testing feature. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Figmotion](https://www.figma.com/c/plugin/733025261168520714) — Figmotion is an animation tool built right in Figma. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg)
### Three D Perspective * [Sketch Isometric](https://github.com/sureskumar/sketch-isometric) — Generate Isometric views from Artboards and Rectangles. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Angle](https://designcode.io/angle) — Apply perspective transforms on-screen mockups. Auto-detect screens by resolution and works on shapes and symbols. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Magic Mirror](http://magicmirror.design) — Perspective Transformation for Sketch Artboards ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Roto](https://www.figma.com/c/plugin/733184376355671573) — Roto extrudes and rotates shapes in 3D. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [SkewDat](https://www.figma.com/c/plugin/741472919529947576) — Live skew any shape and fine-tune with simple non-destructive controls. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Easometric](https://www.figma.com/c/plugin/750743440401413268) — With Easometric it is really easy to create isometric layers & groups. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Rotato](https://rotato.xyz/help) — Get your designs on the screens of photorealistic 3D iPhones and other devices. MacOS app on rotato.xyz. Not available for Windows yet. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Rename Helper * [Symbol Master Renamer](https://github.com/miguelangelnarvaezgo/symbol-master-renamer) — Simple plugin to rename and organizing the master symbols with '/'. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [2O3T Tools](https://github.com/2o3t/2o3t-Sketch-Tools) — Easy Tools, batch rename layers and artboards, etc. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Enumerator](https://github.com/ScottSavarie/Enumerator) — Sketch plugin to rename and number your artboards or layers based on their x,y position ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Rename Instances](https://github.com/exevil/sketch-rename-instances) — Tiny single-command Sketch plugin that renames every symbol instance with its master's name. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Rename It](https://renameit.design) — Keep your Sketch files organized, batch rename layers and artboards. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Layer Renamer](https://github.com/LeonardPauli/LayerRenamer) — Find or rename multiple layers at once using RegEx and flags in Sketch (v.45 tested) ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Renamer](https://github.com/webkul/renamer) — Select multiple layers/groups/artboards and rename all of them on the go. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Rename Layers Based On Textstyle](https://github.com/tbrasington/rename-layers-based-on-textstyle) — Renames text layers in the current page based on their text style name ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Symbol Namer](https://github.com/perrysmotors/symbol-namer) — Rename symbol instances to their override text values ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Symbol Instance Renamer](https://github.com/sonburn/symbol-instance-renamer) — Rename all symbol instances to the name of their master. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Regexp Rename](https://github.com/littlebusters/Regexp-Rename) — You can change the layer name by Regexp in Sketch 3. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Sketch Name Organizer](https://github.com/canisminor1990/sketch-name-organizer) — Rename artboards based on their x and y position; Rename layers based on their Style and Symbol. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Rename Artboards](https://github.com/KevinvBre/Sketch-Rename-Artboards) — Rename Artboards based on their X and Y locations in Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Number Artboards](https://github.com/mmasonlee/sketch-number-artboards) — Sketch plugin to number artboards in order ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Page Numbers](https://github.com/gotomedia/Sketch-PageNumbers) — Sketch plugin for adding page numbers to artboards. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Number Artboards](https://github.com/radermacher/sketch-number-artboards-by-position) — Sketch plugin to number artboards in order of position. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Paginate](https://github.com/jorgemartins/sketch-paginate) — Add page numbers to artboards. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Enumerator](https://www.figma.com/c/plugin/732772204922128885) — Rename and number your frames based on their x,y position ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Layer Names Transfom](https://www.figma.com/c/plugin/734746297902924375) — This plugin will help you to quickly transform the names of your layers. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [namespaces](https://www.figma.com/c/plugin/739106292828562948) — Plugin for automating formatting of page names, frames, components, layers, etc. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Smart Cloner](https://www.figma.com/c/plugin/746805909751572002) — Make multiple renamed copies of components, frames or other layers in seconds. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg)
### Resize * [Push and Shove](https://github.com/ozzik/push-and-shove) — Sketch plugin for resizing, aligning and generally manipulating layers wickedly ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [swap-width-height](https://github.com/dannymcclain/swap-width-height) — Swap a layer's width and height. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Set Min Max](https://github.com/franklymrshankly/Set-Min-Max) — This plugin will resize a layer by height or width to a base max or min value ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Align and Resize To Layout](https://github.com/KevinvBre/Align-and-resize-to-layout) — Align and resize layers to your layout in Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Photo Grid](https://github.com/perrysmotors/photo-grid) — A Sketch plugin that can size layers to common photo dimensions and scale them to fit in a row. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [nudgefromrtl](https://github.com/KevinGutowski/NudgeRTL) — Quickly resize a layer horizontally from right to left with keyboard shortcuts ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketchsize](https://github.com/samlfsun/SketchSize) — A Sketch plugin that lets you resize your design by simple shortcuts. Helps you output splash screen and screenshot for app store&google; play ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Fitter Sketch Plugin](https://github.com/pberrecloth/fitter-sketch-plugin) — Fit layer to artboard width, height or both ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Keyboard Resize](https://github.com/ANGIstudio/Sketch-Keyboard-Resize) — A Sketch plugin that lets you resize objects from all sides with keyboard shortcuts. As a bonus, you can specify the resize amount. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Copy Paste Position & Size](https://github.com/ANGIstudio/Sketch-Copy-Paste-Position-Size) — A Sketch plugin that lets you easily copy & paste width, height, x & y values from and to objects ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Resize Commands](https://github.com/ANGIstudio/Sketch-Resize-Commands) — A Sketch plugin that lets you resize and reposition objects by using simple arithmetic commands, like `b+20,lr+20`. Multiple objects are supported. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Watch Icon](https://github.com/MaxChen/Watch-Icon) — Plugin for Bohemian Coding Sketch app that automatically resizes artwork for the Apple Watch icon. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Resize Artboard](https://github.com/zhifengkoh/resize_artboard) — A Sketch Plugin for resizing artboards to fit their content. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Random Sizing](https://github.com/longzheng/sketch-randomSize) — Sketch plugin to randomly resize selected elements. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Resize](https://github.com/lucaorio/sketch-resize) — Resize (not scale) multiple layers at once via shortcut. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Aspect Ratio](https://github.com/preciousforever/sketch-aspect-ratio) — A simple plugin to apply preset or custom aspect ratios to a selected layer. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Mobile Sizes](https://github.com/keiwes/Sketch-Mobile-Sizes) — Change a rectangle, artboard, or any other object to be the size of a mobile phone. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Scale All in Place](https://github.com/delighted/sketch-scale-all-in-place) — Scale all in place: Resize all selected shapes or layers, in place, from the center. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Nudge Resize](https://github.com/DWilliames/nudge-resize-sketch-plugin) — Resize a layer horizontally and vertically from the centre with easy keyboard shortcuts ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [FlipSize](https://github.com/apertureless/sketch-flip-size) — Flip the size of any artboard or shape ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [fit-to-parent](https://github.com/dannymcclain/fit-to-parent) — Sketch plugin that lets you fit a layer to its parent's width, height, or both. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [PinIt](https://github.com/acollurafici/PinIt) — A collection of Resizing Shortcuts. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Button Resizer](https://www.figma.com/c/plugin/740127005583346577) — Resize your button to fit its label width. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Icon Resizer](https://www.figma.com/c/plugin/739117729229117975) — Resize icons into a standard size and bounding box on your design. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Aspects](https://www.figma.com/c/plugin/739222456238688882) — AboutAspects is a little plugin that helps resize selected elements to fit a certain aspect ratio. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Anchor Resizer](https://www.figma.com/c/plugin/740887843052935394) — Resize the selected layer from any corner or direction. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Margins](https://www.figma.com/c/plugin/742639765059742358) — Resize and position elements using Top, Bottom, Left and Right. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [MultipleResizing](https://www.figma.com/c/plugin/740806995589371083) — You can resize multiple objects at once. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Resize to Frame](https://www.figma.com/c/plugin/753968999663099454) — Select items to resize them to their parent's size (Horizontally, Vertically or Both). ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Proportional Scale](https://www.figma.com/c/plugin/756895186298946525) — Easily resize your shapes with all other attributes resizing proportionally. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Reset Size](https://www.figma.com/c/plugin/748762621505012566) — Plugin for quick access to the resetting size of the instances. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Fit to Artboard](https://github.com/valentindb/fit-to-artboard/blob/master/README.md) — Resize shapes to fit the artboard in no time, using 2 simple custom keyboard shortcuts ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Print Artboard](https://bitbucket.org/adiladdiya/print-artboard) — Create or resize artboard using common or documents sizes (A3, A4, A5, legal, letter, custom ...), unite (mm, in...) and resolution you need. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Nudge and Resize](https://github.com/craigmdennis/adobe-xd-nudge-and-resize/) — Add menu items for nudging and resizing objects (8px by default) so they can be controlled by keyboard shortcuts. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Resize Artboard to Fit Content](https://github.com/littlebusters/Resize-Artboard-to-Fit-Contents) — Resize the artboard to fit the boundary of Contents in the artboard. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Adjust Size by Shortcut](https://github.com/littlebusters/Adjust-size-by-shortcut-for-AdobeXD) — Adjustment size of objects by Keyboard Shortcut. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Fit to Parent](https://github.com/craigmdennis/adobe-xd-fit-to-parent) — Resize objects to match the size of their parent Group or Artboard. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Artboard Size Expander](akira.maru@gmail.com) — Artboard Size Expander allow you to change еру artboard size by 10px or 100px unit. You prefer to set a keyboard shortcut with another utility application. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Selection Enhancement * [Select Similar Layers](https://github.com/wonderbit/sketch-select-similar-layers) — A plugin that selects layers with similar attributes to those of the layer currently selected. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Select Invisible Layers](https://github.com/keremciu/sketch-select-invisible-layers) — Select invisible layers on the current page ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Select All Slices](https://github.com/chibatching/select_all_slices) — Sketch app plugin to select all slices in the current page. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Select Group Layers](https://github.com/mattmcmanus/select-group-layers-sketch-plugin) — Select all child layers of a group with a key command. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Select Parent Artboards](https://github.com/nefaurk/select-parent-artboards) — A Sketch plugin that selects the parent artboards of the current selection ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Select Child Layers](https://github.com/jshuaf/select-children) — A sketch plugin to select all the child layers of a group. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Select](https://github.com/canisminor1990/sketch-select) — Make it much more convenient to select layers with similar attributes. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Query Selection](https://github.com/FrancisVega/sketch-query-selection) — Filter selection layers by type ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Artboard](https://github.com/kenmoore/sketch-artboard) — Next Artboard / Previous Artboard ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [DeepSelect](https://github.com/fhuel/DeepSelect) — A quick and easy way to select layers inside a group, filtering by layer type ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [areanow](https://github.com/norman-woz/areanow) — Get the total area of selected rectangle layers. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Unlock All Selected Layers](https://github.com/derekatkinson/sketch-unlock-all-selected-layers#readme) — Unlock all selected layers using ⌘⌥L ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Transpose](https://github.com/wescraig/Transpose) — Transpose your selection and set pixel margins between elements. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Artboard History](https://github.com/jan-patrick/sketch_artboard-history) — A Sketch plugin to switch faster between your latest artboards. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Reverse](https://github.com/lucaorio/sketch-reverse) — Reverse the position or depth of selected elements. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Similayer](https://www.figma.com/c/plugin/735733267883397781) — This plugin takes Figma’s in-built ‘Select all with...’ command to the next level. Select similar layers; based on a whole range of properties. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Find & Focus](https://www.figma.com/c/plugin/739978920241977182) — A simple plugin to search for layers in your document. The plugin will select the layers containing your text and zoom to fit them. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Select Inverse for Real](https://www.figma.com/c/plugin/739031302880873832) — Inverts your selection within the context of the parent group/frame. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Super Select](https://www.figma.com/c/plugin/750783568176946334) — Select All Siblings and Invert Siblings support multiple layer selections. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Select Parent](https://www.figma.com/c/plugin/742536097587262088) — Select Parent, lets you quickly select the parent object of whatever you have selected. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Replace Nodes](https://www.figma.com/c/plugin/748537235829892910) — Replace Nodes plugin replaces selected nodes with the copied node. Basically, this plugin does paste over selection while removing the original selection. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Send to Top](https://www.figma.com/c/plugin/740593880490123393) — Take any selection and send it to the top of the layer stack. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [SelectMenu](https://sttk3.com/contact) — Select Same: Selecting and executing one item will select items with the same name, class, component instance, position, etc. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Selection](info@paolobiagini.com) — Selection is a command-like plugin for selecting objects with the same properties. It supports local selections inside single Artboards, Repeat Grids and groups, as well as global selections across multiple Artboards. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Go to Next Artboard](https://github.com/iamsolarplexus/adobexd-goToNextArtboard) — This plugin allows easy keyboard navigation from currently selected* artboard to the previous (Ctrl+Alt+Z) or next (Ctrl+Alt+C) artboard. Each movement finishes by zooming the artboard to fit. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [SelectionToArtboard](andreea.marica11@yahoo.com) — The plugin creates a custom-sized Artboard, starting from the user selection. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Find Artboard from Link](alexdobras@gmail.com) — Paste the link from your browser to quickly find an artboard in your document. It can be a web link to a prototype or a spec document. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Shortcut & Keyboard * [Keygaroo](https://keygaroo.ixco.io/) — Keygaroo helps you learn keyboard shortcuts for the actions you use the most. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Shapr](https://github.com/vincenzopetito/Shapr) — A Sketch plugin to create an element with the keyboards! ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg)
### State Management * [Sketch Layer Comps](https://github.com/ozgurgunes/Sketch-Layer-Comps) — A plugin that saves and applies layer states to create different compositions of the current page. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [State Machine](https://github.com/romashamin/statemachine-sketch) — State Machine is a Sketch plugin. Installing it will allow you to use ⌃⌘S to switch an active tab on a tab bar you’re designing, an active navigation section in a menu, or a page number in a pagination control. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch State Switch Master](https://github.com/einancunlu/Sketch-State-Switch-Master) — Define different states and switch between them like a boss. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Checkpoints Plugin for Sketch](https://github.com/einancunlu/Checkpoints-Plugin-for-Sketch) — Save important stages of your artboards in the blink of an eye, and then, move fast and break things. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [States](https://github.com/edenvidal/States) — Create different artboard states and switch between them easily ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg)
### Style Management * [Material Plugin](https://material.io/tools/theme-editor) — Create, customize, and share your own Material theme. Includes Material Theme Editor, plus upload and sync to Gallery. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [FusionCool](https://github.com/alibaba-fusion/cool) — Plugin to using resources of Fusion Design. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Style Master](https://github.com/aparajita/sketch-style-master) — Sketch plugin for renaming shared styles ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Shared Style Finder](https://github.com/sonburn/shared-style-finder) — Find instances of a shared layer or text style. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [lazy-styles-generator](https://github.com/lazybearcreations/sketch-lazy-styles-generator#readme) — Generate shared layer and text styles using the name of the selected layer as the name of the generated style. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Shared Styles Hierarchy](https://github.com/mathieudutour/sketch-styles-hierarchy) — Organize your shared styles using the layers list, create a hierarchy where children inherit properties from their parent. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Flatten Plugin for Sketch](https://github.com/einancunlu/Flatten-Plugin-for-Sketch) — Flatten single or multiple layers instantly, create shared artboard styles, keep them all updated like a boss and boost your Sketch document performance. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Miaow](https://github.com/weixin/Miaow) — A set of plugins for Sketch include drawing links & marks, UI Kit & Color sync, font & text replacing. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Remove Fills and Borders](https://github.com/sebj/Remove-Fills-and-Borders) — Remove a layer's fills and borders in Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Styles Generator](https://github.com/lucaorio/sketch-styles-generator) — Generate hundreds of Sketch Shared Styles in a matter of seconds. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Blur Artboard](http://blur.duanjun.net) — Add blur effect to artboards for testing visual hierarchy easily in your design process. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Smudge](https://github.com/mjkaufer/smudge) — Emulate blend functionality from Adobe Illustrator ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Elevation Shadows](https://github.com/YitingLiu/Elevation-Shadows) — A Sketch Plugin to apply consistent Elevation Shadows ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Styler](https://github.com/oodesign/sketch-styler) — Sketch plugin that assigns styles automatically to all of your unstyled layers. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [copy-paste-shadows](https://github.com/iarthstar/copy-paste-shadows) — Plugin to copy-paste shadows across layers ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [sketch-tailwind](https://github.com/jan-dh/sketch-tailwind) — Export your design to a theme-file you can use in your Tailwind CSS config. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Text to Styles](https://github.com/tbrasington/text-to-styles) — Generates Sketch type styles programmatically from Artboards ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Rough](https://github.com/mathieudutour/rough-sketch) — Transform your shapes in a sketchy, scribbly, hand-drawn-like, style. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Smart Style Switcher](https://github.com/FrancisVega/Sketch-Smart-Style-Switcher) — Switch to an existing test style if attributes match. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Copy Layers Styles](https://github.com/FrancisVega/Sketch-Copy-Layers-Styles) — Sketch plugin to copy Layers and Text styles ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Swappr](https://github.com/pranusarna94/Swappr) — Swap layer positions and styles ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Fix Styles](https://github.com/dinozavrix/sketch_fix_styles) — Remove duplicate styles in Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [styledrop](https://github.com/ryanmclaughlin/styledrop) — A plugin for Sketch allows you to easily copy styles from one layer to another. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Copy & Paste Shadows](https://github.com/ryanjohnson-me/Sketch-Copy-Paste-Shadows) — Copy & paste only shadow styles from layers without other styles getting in the way. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Make Long Shadow](https://github.com/JayHoltslander/Sketch-Make-Long-Shadow) — A plugin for Sketch to create long shadows from a shape. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [system-styles](https://github.com/sebcglbailey/sketch-system-styles) — Generate all the text styles you'll need, including alignment and colour. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Swap Styles](https://github.com/ozzik/swap-styles) — Sketch plugin for swapping styles between two layers. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Themer](https://www.figma.com/c/plugin/731176732337510831) — Themer allows you to easily swap between published styles from your libraries. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Kaleidocode](https://www.figma.com/c/plugin/736060893363678891) — Convert VS Code themes to Figma color libraries, create new themes via JSON, and swap themes automatically. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [UI Kit](https://www.figma.com/c/plugin/747227147599827533) — This plugin makes a preview for the fonts and colors used on the layouts or from your styles. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Noise](https://www.figma.com/c/plugin/752558325552095625) — Make some noise in Figma! Noise is a handy tool when you need to add a hint of realism to your work. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Convert Shape](info@paolobiagini.com) — Convert Shape is a command-like plugin that easily converts a shape into another, keeping the original appearance. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Style Mate](https://useratio.com/stylemate/) — Apply consistent styles and design tokens as fast as you can type. Change color, typography, dimensions and more with precision through a single interface. Create design tokens and share them with other designers and developers. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Swap Fill and Border](naru.kubota@gmail.com) — Swap Fill and Border is a plugin that allows you to switch fill and border colors in a moment. You can save your time and let you focus on the UI that really matters ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Reorient path](mr.flashi@gmail.com) — Reset the path rotation without affecting the shape. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Reverse Button Fill](https://github.com/masa-sumimoto/adobe-xd-reverse-button-fill) — A plugin that reverse fills a text and a rectangle ( or an ellipse ). This plugin is intended to be used for button-like elements. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Swap Position](https://github.com/boopeshmahendran/AdobeXD-Swap-Positions) — Swap the position of two selected nodes ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Toolabs DSM](https://www.toolabs.com/xdplugin) — a stateful design system manager which lets you link design tokens to design elements in your Adobe XD documents and make them themeable by defining system state variations, with no need to copy and paste your artboards. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Symbols & Components Management * [Symbol Browser](http://symbol-browser.pratikshah.website/) — A new way to browse your symbols. Make the most of your Design System by bringing symbols and UI Sticker sheets together. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [symbol-insert](https://github.com/lifeofmle/symbol-insert) — Simple plugin to insert Sketch symbols ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Symbol-Merger](https://github.com/franklymrshankly/Symbol-Merger) — A Sketch plugin that merges duplicate symbols ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Disconnector](https://github.com/njcrowther/Disconnector) — Quickly disconnect all symbols from a selection ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [restore-overrides](https://github.com/danielthall/restore-overrides) — A small plugin to store and restore override values before and after library updates ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Symbol States](https://github.com/ozgurgunes/Sketch-Symbol-States) — A Sketch plugin that saves overrides of a symbol instance as states to be applicable on another instance of that symbol later. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Overrides Manager](https://github.com/ozgurgunes/Sketch-Overrides-Manager) — A Sketch plugin that makes managing overrides easier. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Escriba](https://github.com/Pausansol/Escriba) — Sketch plugin to copy-paste symbol overrides ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Format Symbol Names](https://github.com/perrysmotors/format-symbol-names) — A Sketch plugin to nicely format the names of all artboards or symbol masters on the current page ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Library Unlinker](https://github.com/perrysmotors/sketch-library-unlinker) — Unlink symbols linked to a specific library, or unlink symbols that have been deleted in their libraries. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Select Same Symbols](https://github.com/yusukesaitoh/sketch-select-same-symbols) — Select the same symbols as the currently selected symbol. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Move To Library Sketchplugin](https://github.com/ahmedmigo/Move-to-library-sketchplugin) — You can now move symbol from your project to any library and re-attach all the symbol instances to this library. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Symbol Swapper](https://github.com/sonburn/symbol-swapper) — Swap the selected symbols and/or symbol instances to a master of the same name in a library. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Symbol Instance Locator](https://github.com/sonburn/symbol-instance-locator) — Locate all instances of a selected symbol or instance. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Symbol Instance Sheet](https://github.com/sonburn/symbol-instance-sheet) — Generate a sheet of symbol instances from your current document or a library. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Library Symbol Replacer](https://github.com/zeroheight/library-symbol-replacer) — Sketch plugin to replace symbols in existing documents with library symbols ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Symbol Importer](https://github.com/sketch-symbol-importer/sketch-symbol-importer) — Import symbols from on Sketch file into another. Maintains overrides and updates existing symbols in place. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Find All Instances of Symbol](https://github.com/mcansh/sketch-find-all-instances-of-symbol) — Find all instances of a symbol in Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Merge Duplicate Symbols](https://github.com/oodesign/merge-duplicate-symbols) — Sketch.app plugin to merge symbols with the same name. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Instance Locator](https://github.com/d4rekanguok/instance-locator) — Locate instances of a selected symbol and navigate to them, anywhere in the doc. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Prefixation Sketch Plugin](https://github.com/pberrecloth/prefixation-sketch-plugin) — Manage the prefixes of your layers, artboards or symbols ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Find All Instances of Symbol](https://github.com/nmwoods1/Sketch---Find-all-instances-of-symbol) — A Sketch plugin that lets you find all of the instances of a symbol across multiple pages/artboards ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Duplicatesymbol](https://github.com/marianomike/sketch-duplicatesymbol) — Sketch plugin that creates a new symbol out of a selected symbol ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Path Prefix Remover](https://github.com/Elethom/Sketch-PathPrefixRemover) — Remove path prefix for symbol instances. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Symbol Me](https://github.com/websiddu/sketch-symbol-me) — Convert all your similar layers to symbols with a single click. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Import Symbols](https://github.com/kmerc/sketch-import-symbols) — Easily import symbols from another Sketch file ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Batch Create Symbols](https://github.com/demersdesigns/sketch-batch-create-symbols) — A plugin for Sketch to convert selected layers to individual symbols. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Unlinker](https://github.com/eivindbohler/Sketch-Unlinker) — Sketch plugin that lets you unlink selected layers and groups from either shared symbols, styles or text styles, en masse. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Disconnect for Sketch](https://github.com/einancunlu/Disconnect-for-Sketch) — Disconnect/unlink selection from symbols and shared styles. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SymbolNameSync](https://github.com/griffin-stewie/SymbolNameSync) — This plugin gives you syncing names between Symbol masters and its instances. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Symbol Legend](https://github.com/amimagid/sketch-symbol-legend) — This plugin provides indexing of Symbols in your artboard with a detailed legend. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [symbol-overlay-toggle](https://github.com/uxcourt/overlaytoggler) — A Sketch plug-in to seek specific style names in library-sourced symbols and toggle the styles. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Instance Finder](https://www.figma.com/c/plugin/741895659787979282) — Find all Instances of a Component used in your file. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Locator](https://www.figma.com/c/plugin/741935812012883481) — Locator helps you find all instances of a component and enables you to jump to each instance. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Component Page](https://www.figma.com/c/plugin/749583881837062159) — This plugin enables you to create a component (like you would in Sketch) where the master moves to a dedicated page leaving an instance in place. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Reattach Instance](https://www.figma.com/c/plugin/741415678427267506) — Relink a frame to a component by searching for similar instances. (... ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Component Replacer](https://www.figma.com/c/plugin/748545064462894895) — A simple plugin that helps you to replace any selection with components or instances. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Safely Delete Components](https://www.figma.com/c/plugin/746849770992339499) — When you delete a component, it can be still used in your mockups. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Send to Components Page](https://www.figma.com/c/plugin/749061307736645564) — If you prefer to keep your components on a separate page and are tired of carrying them manually, this plugin is for you. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Component Master Manager](https://www.figma.com/c/plugin/754404293457940119) — Component Master Manager is a simple plugin to collect, sort and group master components from selected pages to one page for organise your design system. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Create Component Inside](https://www.figma.com/c/plugin/754240053660034676) — Create components anywhere you want! You can use this plugin instead of the standard Create Component command. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Replacer](https://nurecas.com/replacer-a-plugin-for-adobe-xd) — Did you create multiple copies of an object without making them a symbol? And now, do you want to change it all, but have to go one by one? Fret no more, replacer will help replace individual vector objects and texts with one click. First, select the object to be replaced and then select the object it has to be replaced with. Then run the plugin and all instances of the first object will be replaced by the second. Enjoy! ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Text Management * [Truncat](https://github.com/KevinGutowski/Truncat) — A Sketch plugin to truncate text. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Copy Text Only](https://github.com/explorador/sketch-copy-text-only) — Sketch plugin to copy only the text from selected artboard(s) or layer(s) ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Context](https://github.com/afnizarnur/context) — Count character, words, and paragraphs from a text layer easily inside Sketch! ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Create New Styles](https://github.com/franklymrshankly/Create-New-Styles) — A Sketch plugin to create multiple layer styles or text styles ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [QuickTextOverride](https://github.com/dbilyk/QuickTextOverride) — Use a key command to target the first text override of a symbol. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Translate From JSON](https://github.com/kbirgoren/sketch-json-translator) — A Sketch plugin lets you use variables for texts in your designs. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Find and Replace Text](https://github.com/chriswetterman/sketch-find-and-replace-text) — Find and replace text throughout your Sketch document ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Case Converter](https://github.com/ozgurgunes/Sketch-Case-Converter) — Convert text layers, symbols or all instances of a symbol. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Bold It](https://github.com/ysjn/bold-it) — Bold-it is a super simple plugin that bolds a user-specified keyword in selected text layers. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [add-trailing-space](https://github.com/tgfjt/sketch-add-trailing-space#readme) — add trailing space into selected text layers ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [adjustToFit](https://github.com/andyault/sketch-adjusttofit) — A quick Sketch plugin to resize text layers, groups, and artboards to fit their content. Also, supports nested resizing. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Emoji Autocomplete Sketch Plugin](https://github.com/zeplin/emoji-autocomplete-sketch-plugin) — While editing Sketch text layers, type “:” followed by the first few letters to auto-complete emojis. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Hyphenator](https://github.com/golmakov/sketch-hyphenator) — Sketch plugin that hyphenates text ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Textbox fit Content](https://github.com/juliussohn/sketch-textbox-fit-content) — This plugin sets the height of a selected text layer or all text layers in a selected group to its content's height. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Fast Text Transfer](https://github.com/jbentzen/sketch-fast-text-transfer) — Lightning-fast copying, pasting and swapping text. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Style Libraries](https://github.com/sigtm/sketch-style-libraries) — Sync layer & text styles from any Sketch Library ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [I Want Apple System Font](https://github.com/usagimaru/Sketch-AppleSystemFont-Plugin) — A Sketch plugin for applying Apple system font to text layers. (For Japanese designers.) ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Translate.me](https://github.com/eddiesigner/sketch-translate-me) — Translations. Simplified. Translate your Sketch text layers, artboards, and pages in over 100 languages with Translate.me plugin. Powered by Google. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Auto Translate](https://github.com/symdesign/sketch-auto-translate) — Plugin to translate Sketch files into via Google Translate. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Title Case](https://github.com/Hemmingsson/Sketch-Title-Case) — Sketch Plugin to make text Title Case ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Truncate Text Lines](https://github.com/mamuso/sketch-truncate-textlines) — Truncate the number of lines of a textbox, adding an ellipsis if needed. It works using words or characters. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch SF UI Font Fixer](https://github.com/kylehickinson/Sketch-SF-UI-Font-Fixer) — A Sketch plugin that adjusts the character spacing on text layers using iOS 9's SF UI Text/Display fonts to what it would be when used in an iOS app. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Adjust Button Shape](https://github.com/psilfver/sketch-adjust-button-shape) — A Sketch plugin that adjusts a shape layer according to the attributes of a text layer ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Pseudol10n](https://github.com/arieare/Sketch-Pseudol10n) — Sketch plugin to pseudolocalize text layers ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Text Tools](https://github.com/automat/sketch-text-tools) — Sketch App Typography Plugin for working with font metrics, aligning text-layers and building typographic systems. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Update Text Layer Name](https://github.com/Creatide/Sketch_Update-Text-Layer-Name) — Sketch plugin to update Text layer names from their own text values. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [TitleCase](https://github.com/jessebilsten/Sketch-TitleCase) — A Sketch plugin that changes your text to TitleCase ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Clean Up SF UI Type](https://github.com/schwa23/cleanupsfui) — Sketch Plugin to clean up SF UI fonts character spacing & normalize text & display variants. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Find And Replace](https://github.com/thierryc/Sketch-Find-And-Replace) — Sketch 3 plugin to do a simple find and replace on text within layers ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Character Count](https://github.com/andrewfiorillo/sketch-character-count) — Sketch plugin to count the number of characters in a text layer ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SketchTextSourcer](https://github.com/hamidp/sketchtextsourcer) — Sketch plugin for easily populating a bunch of text layers from a source. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Align Text Baseline](https://github.com/soutaro/Align-text-baseline-sketch-plugin) — Align text layer vertically based on its baseline and cap-height. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Efficiency](https://github.com/x-raizor/Efficiency) — Set of plugins for efficient work: change text linespacing and leading via keyboard, random sizing and random positioning of selected items, keep only text layers in selection. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Set Line Height](https://github.com/getflourish/Sketch-Set-Line-Height-Plugin) — Plugin that allows you to set the line-height of a text layer as a multiple of the font size. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Switch Text Spacing](https://github.com/littlebusters/Switch-Text-Spacing) — Switch text spacing with OpenType features. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Plugins](https://github.com/joshwayne/jw-sketch-plugins) — Josh Wayne's plugins for Sketch. So far, it includes two very interesting commands for working with text layers. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Comma](https://github.com/margusholland/Comma) — Sketch plugin for text modifications ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [San Francisco UI Font Fixer](https://github.com/Elethom/Sketch-SFUI-Font-Fixer) — Adjusts font, character spacing, line height for labels using San Francisco font. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Typograph](https://github.com/dezonik/Typograph) — Typograph — Sketch plugin and js-library ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Spell Check Whole Page](https://github.com/Tallwave/sketch-spellcheck-all-layers) — A basic spellchecker that checks all layers on a page in Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Count Text](https://github.com/joshkissel/sketch-count-text) — A Sketch plugin to count: characters, words, whitespace, and paragraphs ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [LaTeX Sketch Plugin](https://github.com/heytitle/latex-sketch-plugin) — This plugin brings LaTeX functionalities to Sketch, and allows us to directly write mathematical formulas ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [polyglot](https://github.com/fruitfrills/polyglot) — Text translations ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Typographer](https://www.figma.com/community/plugin/781351612272770724/Typographer) — format text with typographic features traditionally used in fine printing. ![Figma](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Find and Replace](https://www.figma.com/c/plugin/735072959812183643) — Search for texts on your page and replace them just like a text editor. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Change Text](https://www.figma.com/c/plugin/735148445325474400) — With Change Text, you can bulk edit the text contents of multiple layers, groups, and frames. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Nisa Text Splitter](https://www.figma.com/c/plugin/739048247603902878) — Easy way to split your text/list into small text pieces. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Polyglot](https://www.figma.com/c/plugin/736439252271864504) — Polyglot is made for designers working on global products. By bringing localization to the design phase, we hope to streamline the product development lifecycle. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Add numbers to texts](https://www.figma.com/c/plugin/738791203005929386) — Create numbered lists easily. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [TextCutter](https://www.figma.com/c/plugin/739131137116544548) — TextCutter takes a layer with multiple lines of text and splits it into separate text layers. Empty lines get discarded automatically. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Word Count](https://www.figma.com/c/plugin/742152456731717201) — A dead-simple plugin that counts the number of words and characters in any selection. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Text Counts](https://www.figma.com/c/plugin/740632514053994647) — A simple way to count the number of characters, spaces, and words inside a text layer. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Copy and Paste Text](https://www.figma.com/c/plugin/738916553283875028) — Figma plugin to copy & paste only text (without text styls) from selected layers. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Counter](https://www.figma.com/c/plugin/739106133703249411) — Make sure copy is easy to read with this easy character counter.“The ideal width of a line of text is from 45 to 75 characters—including spaces. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Substrate for text 2.0](https://www.figma.com/c/plugin/739517744595900126) — Highlight text by adding the cool substrate with this simple plugin! ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Bunch Text Changer](https://www.figma.com/c/plugin/739192358533401183) — Select one or several text layers, call the plugin and Paste or type a new value. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Retextifier](https://www.figma.com/c/plugin/750499296698468459) — Change multiple texts without having to click on each of them first. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [text to line](https://www.figma.com/c/plugin/758250492778745937) — Removes extra spaces, line breaks, and paragraphs. Formats the font and style of the layer by the first character. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [arc](https://www.figma.com/c/plugin/762070688792833472) — Curve your text upward, downward or into a circle. Adjust the slider and preview the result. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Hemingway](https://www.figma.com/c/plugin/760035865558407437) — Make your writing bold and clear. Select any text element and run the plugin. It will analyze the text using Hemingway's rules around adverbs, passive voices, complex phrases, and hard sentences. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Latex Editor](https://www.figma.com/c/plugin/754622689958838972) — Simple plugin to insert math equations into documents. It uses an API to transform LaTeX text into SVG images that can be easily manipulated in Figma designs. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Reset Text Layer Name](https://www.figma.com/c/plugin/759101941814288575) — Ever end up wanting to reset your layer names, so the name reflects your text content? ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Simple Bullets](https://www.figma.com/c/plugin/750174581284816960) — Simple plugin which makes it easy to add bullets in text layers. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Bullets](https://www.figma.com/c/plugin/734628505008435795) — Add custom bullets to your layers and create reusable list styles via the power of components. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Golden Line](https://www.figma.com/c/plugin/739046186899657111) — Change line height based on the Golden Ratio. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Content Buddy](https://www.figma.com/c/plugin/731260490045684148) — A Figma Plugin that makes replacing text content in multiple layers super easy for anyone. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Proper Title Case](https://www.figma.com/community/plugin/776197163275203567/Proper-Title-Case) — format headlines and titles into a proper title case, based on style guides from APA and The Chicago Manual of Style. ![Figma](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [SplitText](https://github.com/yoshikinoko/SplitText) — Split Text by newlines, tabs, and commas. (To split text by tabs, copy and paste text from another editor.) ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Clip Text](https://github.com/Raphael-D/xd-plugin/tree/master/clip-text) — Copy on clipboard plaintext of selected texts. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Texts Selector](http://omoon.org) — By this plugin, you can select all text elements from selected items. You can easily change the font face, size, and color of multiple text elements at once. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Text to Clipbord](https://www.coffee-break-designs.com/production/text-to-clipbord/) — Copy multiple texts to the clipboard. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Simple Find and Replace](jakovcevski@gmail.com) — A simple case-sensitive find and replace text plugin for Adobe XD. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Change Case](info@paolobiagini.com) — Change Case is a command-like plugin for changing text capitalization. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Place Text](richard.vanderdys@gmail.com) — Quickly create text placeholders, or customize the look you need. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Count Text](https://github.com/boopeshmahendran/AdobeXD-Count-Text) — Counts the number of words and characters in the selected text layer(s) ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [changeTextCase](adarshgupta602@gmail.com) — A plugin which helps you to change the case of text in snake_case, kebab-case, lowercase, and uppercase. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Translation & Localization * [Crowdin for Sketch](https://github.com/crowdin/sketch-crowdin)/[for Figma](https://www.figma.com/c/plugin/802555101361690489/Crowdin-for-Figma) — translate content on pages and artboards into multiple languages before programming starts. Quickly generate language-specific assets. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) ![Figma](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Qordoba for Sketch](https://www.qordoba.com) — Qordoba’s Sketch plugin allows designers to translate their mockups to other languages, making product internationalization easier. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Auto Translate](https://github.com/symdesign/sketch-auto-translate) — automatically translate Sketch files based on your selection, the current page or the whole document via Google Translate. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Translation](https://github.com/hoai265/Language-Sketch-Plugin) — A Sketch plugin for easy multi-language design ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Texts Translate](https://github.com/laresgoiti/texts_translate) — Manage Sketch texts in multiple locales. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Translate.me](https://github.com/eddiesigner/sketch-translate-me) — Translations. Simplified. Translate your Sketch text layers, artboards and pages in over 100 languages with Translate.me plugin. Powered by Google. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Translate](https://www.figma.com/c/plugin/733062974250826253) — Translate helps you test your UI against different languages to see what may break by using the Yandex Translate API to translate your text layers into other languages. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Translator](https://www.figma.com/c/plugin/743218037112142643) — Translator instantly translates the text in your Figma designs into other languages. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [World Ready](worldr@adobe.com) — World Ready plugin can be used to 1. Check the layout of your artboards for localization readiness & 2. Generate localized artboards. After launching the plugin from the Plugins menu in XD, pick a translation service, choose the “Highlight” or “Translate” mode and select the languages to test. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Pseudo Localization](hello@raiken.io) — The pseudo-localization plugin generates a pseudo-language localization based on your copy. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Typeface * [Datazier Lens](https://github.com/enriquezgomez/datazier-lens) — Inspect and sort your local font book ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [betterTypePanel](https://github.com/KevinGutowski/betterTypePanel) — A sketch plugin to help manage common OpenType properties ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [French Typography](https://github.com/Saint-loup/french-typography) — Sketch plugin to automatically add typographic french conventions and non-breaking spaces ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sd Changer](https://github.com/yeun/sd-changer) — Converts Apple SD Gothic Neo font to SF Pro Display ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [AutoFixiOSTextLineHeight](https://github.com/youngxkk/AutoFixiOSTextLineHeight) — Auto Fix iOS Text Line Height, so that the font restoration degree of iOS design draft reaches 100%. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Inter UI Character Spacing](https://github.com/qruzz/InterUI-Character-Spacing) — Package to correct the character spacing for the InterUI font in Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Fontily](https://github.com/partyka1/Fontily) — Sketch plugin for finding & replacing fonts for Sketch 3+ ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Perfecter](https://github.com/Volorf/Perfecter) — Make great typography [Sketch plugin] ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Font Packer](https://github.com/bigxixi/Font-Packer) — A Sketch plugin to collect font files you used in your sketch file. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [FontFinder](https://github.com/ukn530/FontFinder) — Sketch Plugin to find and select font items in a current page ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Use Icon Fonts in Sketch](https://github.com/keremciu/sketch-iconfont) — Use icon fonts in sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Font Mixer](https://github.com/littlebusters/Sketch-Font-Mixer) — Plugin can apply other fonts for each character type of Text Layer. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Plugins](https://github.com/alssndro/sandros-sketch-plugins) — A library of Sketch Plugins aimed towards working with horizontal/vertical grid layouts and typography. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Font Buddy](https://github.com/AnimaApp/FontBuddy) — Install missing fonts & free fonts directly from Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Golden Ratio Line Height](https://github.com/lorenzwoehr/Golden-Ratio-Line-Height-Sketch-Plugin) — Optimize your typography based on font size, line-height and width. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Font Size Checker](https://github.com/feb19/sketch-font-size-checker) — Text Size Validator for iOS or Android UI Designers. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Typesettings](https://github.com/buames/typesettings-sketch-plugin) — A quest for consistency ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Font Scale](https://www.figma.com/c/plugin/741231992144144738) — Font Scale is a quick tool to generate a harmonious and consistent typography hierarchy. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Better Font Picker](https://www.figma.com/c/plugin/739922281164562258) — Better Font Picker helps you select fonts with a preview of how it looks. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Font Replacer](https://www.figma.com/c/plugin/738840446766071906) — Font Replacer lets you easily replace font families and font styles. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [MixFonts](https://www.figma.com/c/plugin/735711462872799891) — helps you easily use different fonts for Latin and CJK characters in selected text layers. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Font Fascia](https://www.figma.com/c/plugin/746097413727734148) — List all font families and styles used in the document. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Fix San Francisco](https://www.figma.com/c/plugin/742063658553085504) — automatically apply the correct font-variant and tracking for selected texts using the San Francisco typeface. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Typograf](https://www.figma.com/c/plugin/745519632050796775) — Figma plugin for making good typographic text. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Missing Font Selector](https://www.figma.com/c/plugin/745394880974490845) — This tiny faceless plugin will find and select for you all layers with missing fonts on the current page. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Global Font Replace](https://github.com/adamcoulombe/Global-Font-Replace-for-Adobe-XD) — Useful for replacing a font across an entire document. Select an item that has the font you want to copy, then, select an item that uses the font you want to replace. Then, voilà! ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [FindFont](https://nurecas.com/findfonts-a-plugin-for-adobe-xd) — Find all instances of a font style and replace it with another. First select a text field with the font to be replaced. Then select a text field with the font which will replace the former. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Typist](https://github.com/gioalo) — Typist is a typography tool that lets you create beautiful modular typography scales base on musical notes or any magical number (Golden Ratio). ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Font Preview](n.bhargavvenky@gmail.com) — This Plugin Shows Preview Of Fonts in your System ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### UI Kits * [BillUI](https://github.com/SimonTakman/BillUI) — Interactive artificial evolutionary tool in order to help you come up with design suggestions that are similar to your initial design. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [WtDesign](https://github.com/wantedly/sketch-wt-design) — Sketch plugin for Wantedly Design System ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Polaris Telescope](https://github.com/Shopify/polaris-telescope) — Access Shopify Polaris from Sketch to speed up your design or development workflow ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Material](https://github.com/websiddu/sketch-material) — Sketch material is a sketch plugin that will help you generate complex material components like tables, chips, forms etc… ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Atlassian Vendor Sketch Plugin](https://github.com/atlassian/sketch-plugin) — Design your next Atlassian app with our component libraries and suite of Sketch tools ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Mouse Pointers](https://github.com/stuartromanek/sketch-mouse-pointers) — Add Mouse Pointers to Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Save with Device Frame](https://github.com/redgell/Save-with-Frame) — Sketch Plugin to generate pngs of artboards wrapped in a phone skin. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Artboard presets for social media images](https://github.com/herrhelms/social-artboards-sketch) — This is a Plugin for Sketch App that adds artboard presets for the most common image dimensions of different social media platforms. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Better Shadow](https://github.com/JJYing/Sketch-Better-Shadow) — Quickly generate multi-layered shadow to mimic non-linear decay. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Indigo.Design](https://cloud.indigo.design/resources) — Create, edit, and apply themes to your Indigo.Design UI Kit based designs and publish them as prototypes to the Indigo.Design cloud. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Iconify](https://github.com/iconify/iconify-sketch) — Iconify integration. Import MDI, FontAwesome, Jam, EmojiOne and many other icons to Sketch document. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Material Design Icons](https://www.figma.com/c/plugin/740272380439725040) — This plugin provides you instant easy access to the entire Material Design Icons library. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Feather Icons](https://www.figma.com/c/plugin/744047966581015514) — Quick access to Feather icons in Figma. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Iconscout](https://www.figma.com/c/plugin/744098704933821409) — Iconscout allows you to insert millions of high-quality icons, illustrations, and stock photos right into Figma. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Icon Zone](https://www.figma.com/c/plugin/739711077384375064) — Icon Zone helps create a square slice around your icons what is the perfect center of the vectors or the group you selected. At the same times, the slice will be ready to export as SVGs. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Social Media Image](https://www.figma.com/c/plugin/750116735703341112) — Cheat sheet on Social Media image sizes. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Hero Patterns for Figma](https://www.figma.com/c/plugin/743134103711120154) — This plugin brings the amazing collection of patterns called Hero patterns by Steve Schoger. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Interplay](https://www.figma.com/c/plugin/736368164448889527) — Interplay connects with your design system code repository to let you access and use your design system code components right within Figma. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Ready Mobile Components for Adobe XD](http://fluidtech.in/ready) — The plugin helps you to generate the basic general purpose-components which are commonly used. You can further carve these components to your choice by just changing the styles. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Bullet](hasankaz@hotmail.com) — Bullets plugin as the name suggests helps you to add round, square bullets as well as an ordered list to your text layers. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Personas](https://tourdexd.com/plugin/personas/) — Create beautiful and customizable personas with different layouts and image styles. Crafting personas has never been easier and more fun. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [unDraw](https://xd.undraw.co) — Beautiful illustrations for your client and personal design projects, without attribution. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Stipo Components Library for XD](https://www.udesly.com/help-center/) — Stipo lets you store all components of your XD design in one library to access anytime, anywhere. You can save your components by tags, title, descriptions and make them easy to explore through the Stipo Library ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [NIBM Icon Hamburger](https://github.com/pradeep-sanjaya/adobe-xd-plugin-c91a5b5d/issues/new) — Add hamburger icon to your artboard ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### User Flows * [Flow Exporter](https://github.com/romannurik/Sketch-FlowExporter) — A Sketch plugin that exports prototype flows built with Sketch 49+ to HTML. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch User Flows](https://github.com/reqfire/sketch-user-flows) — A Sketch Plug-in for importing/exporting user flow and interface definitions from Reqfire. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Overflow](https://overflow.io) — Overflow is the world’s first user flow diagramming tool tailored for designers. It empowers designers to design, present and share beautiful user flow diagrams that tell a story. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [User Flows](https://github.com/abynim/userflows) — Generate user walkthroughs from Artboards in Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [ViewController for Framer](https://github.com/awt2542/ViewController-for-Framer) — Multi-step user flows in Framer.js ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Primary Sync](https://github.com/Primary-app/primary-sync) — Sync your Sketch designs with Primary's user flows and design documents. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Userflows](https://github.com/faridsabitov/Sketch-user-flows) — Plugin for generating easy to use user flows in Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Connection Flow Arrows](https://github.com/faridsabitov/Sketch-Connection-Flow-Arrows) — Plugin for generating easy to use connection flow arrows in Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Autoflow](https://www.figma.com/c/plugin/733902567457592893) — Autoflow makes it easy to draw flows. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Wireframe](https://www.figma.com/c/plugin/742764242781786818) — Wireframe plugin is the best for creating beautiful user flow prototypes and basic structures in Figma so no other kits, files or skills required! ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg)

Abstract

### Version Control * [Abstract](https://www.goabstract.com/) — Abstract is a file management and version control tool for Sketch files ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Git Sketch Plugin](https://github.com/mathieudutour/git-sketch-plugin) — A Git client generating pretty diffs built right into Sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Hback Plugin](https://github.com/YusukeKokubo/sketch-hback-plugin) — A Sketch Plugin for history back and forward. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Plant](https://plantapp.io) — Version control for designers ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Git Pro](https://github.com/xuming/sketch-git-pro) — Git tools for sketch. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Time Machine](https://www.figma.com/c/plugin/734492262527930956) — Time Machine saves and organizes work that you want to look back on. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Versions](https://versions.sympli.io) — Full-featured version control tool for designers. Works with GitHub, GitLab, Bitbucket and Azure Devops ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg)
### Website & HTML Export * [Sketch2Web](http://www.sketch2web.skuko.com) — Export your project to the web in just one click. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Puzzle Publisher](https://github.com/ingrammicro/puzzle-publisher) — Exports Sketch artboards into linked HTML files and publish it on an external site using SFTP. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Slinky](https://github.com/finchalyzer/slinky) — Export your Sketch designs as HTML email templates ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Design Doc](https://github.com/mamuso/sketch-designdoc) — Exports a simple website using a bunch of conventions and a Sketch document as the structure. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Click Dummy](https://github.com/Raureif/sketch-click-dummy) — Export simple HTML click dummies to prototype interactivity. Just draw rectangles to create links between artboards. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [sketch-share](https://github.com/robflaherty/sketch-share) — Sketch plugin that exports artboards and generates an HTML file linking to each one ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sparkle Export Plugin](https://sketch-to-web.com) — Turn any Sketch artboard in a real website using Sparkle Visual Website Builder ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Launchpad](https://launchpad.animaapp.com) — Export your Sketch design into HTML website. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [HTML Export](https://github.com/mludowise/sketch-html-export) — Generates an HTML page of images from your artboard. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [NeoPreview](https://github.com/alanfraneo/sketch-neo-preview) — A plugin to create HTML based preview and gallery straight from sketch artboards ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Click-Thru Prototype](https://github.com/markhorgan/click-thru-prototype) — Generates a HTML click-through prototype of your responsive website design. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch To Clickthrough HTML](https://github.com/amin-nas/Sketch-to-Clickthrough-HTML) — Sketch plugin for creating a clickthrough HTML prototype ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Protoship Codegen Sketch Client](https://github.com/protoship/codegen-sketch-client) — Build complex web apps from Sketch designs by generating elegant HTML & CSS that programmers can easily understand, adapt, and deploy ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [davinci_vip](https://github.com/dvcdv/dvc_sketch_plugin) — Export the metadata of the sketch file and then use it for web layout (absolute) ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Get Margins](https://github.com/peterwooley/get-margins) — Gets the margins between an inner and outer layer and then copies the results to the clipboard as CSS. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [HtmlGenerator](https://www.figma.com/c/plugin/753195897635985866) — HtmlGenerator renders any selection into its HTML equivalent with its associated CSS, all indented and separated for you to copy and paste. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg)
### Workflow Improvements * [Sketch Search Everywhere](https://github.com/MrPeak/sketch-search-everywhere) — Search layer and select it, by matching textValue, name or ObjectID. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Handy Menu](https://github.com/sergeishere/HandyMenu-SketchPlugin) — Gives quick access to your plugins through the context menu ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Symbol Text Inspector](https://github.com/dbilyk/SymbolTextInspector) — Easily inspect the specifications of all text overrides in symbols, including in nested symbols. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Symbol Browser](http://symbol-browser.pratikshah.website) — A new way to browse your symbols. Make the most of your Design System by bringing symbols and UI Sticker sheet together. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SymbolNameAutocomplete](https://github.com/griffin-stewie/SymbolNameAutocomplete) — This plugin gives you autocompletion of symbol names when creating a symbol. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Overrideit Sketchplugin](https://github.com/ahmedmigo/overrideit-sketchplugin) — Overrideit is a sketch plugin that allows designers to search in override list and overrides dropdowns, and with many other features. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Symbols Manager](https://gumroad.com/l/sketch-symbols-manager) — A fast and easy way to manage all your symbols. No more hassle with long and complex symbols name, or renaming tons of symbols because you misspelled a folder name. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Paster](https://github.com/Volorf/Paster) — Sketch plugin. Paste text data from clipboard to Sketch text layers ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Laboji](https://github.com/rezaaa/Laboji) — A sketch plugin for adding emoji on layer names like colorful labels or tags. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Ace Jump](https://github.com/turbobabr/sketch-ace-jump) — Quickly focus on various inspector's fields like font size, font weight and text/fill color using shortcuts. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Select Exportables](https://github.com/yargies/sketch-select-exportables) — Select all exportable layers, slices, and artboards. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch - SelectPlus](https://github.com/nathan5x/sketch-selectplus) — Helps you select a different types of layers, specific Shapes like Rectangle, Ovals, Triangles, Lines, Arrows, Paths, etc. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Looper](https://github.com/sureskumar/Looper) — Looper helps automate the duplication of groups and layers. One can control properties like Rotate, Scale and Opacity while duplicating. This powerful combination enables artists and designers to create interesting geometric and organic patterns. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Reselect](http://www.reselect.co) — Reselect allows you to restore a previous selection or save selections for later use (even after you close the document). ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Wanderer](https://github.com/turbobabr/sketch-wanderer) — Frictionless, Finder like navigation in layer list by using beloved arrow keys and simple shortcuts. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Action](https://github.com/onmyway133/sketch-action) — Spotlight in Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Navigator](https://github.com/arshad/Sketch-Navigator) — Artboard navigation (with autocomplete) for Sketch ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Runner](http://sketchrunner.com) — Speed up your Sketch workflow ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Nudged](https://github.com/KevinWoodhouse/Sketch-Nudged) — A Sketch plugin to easily edit your nudge distance settings. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Nudge, Push, Shove.](http://www.nudgepushshove.com) — Change the big and small nudge settings right within Sketch. Plus, get access to an even bigger nudge setting. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Plugin Manager](https://mludowise.github.io/Sketch-Plugin-Manager) — Keeping your Sketch plugins up to date with the power of Git. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Move Half Pixel](https://github.com/canisminor1990/sketch-move-half-pixel) — Move layers the half-pixel ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Stickers](https://github.com/romannurik/Sketch-Stickers) — A Sketch plugin that lets you browse and quickly drag+drop stickers (specially tagged layers) in your Sketch Libraries. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Artboard Manager](https://github.com/bomberstudios/artboard-manager#readme) — Because moving artboards manually is *so* 2016. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [DS Automator Sketch Plugin](https://github.com/pavelneznanov/ds-automator-sketch-plugin) — Tools for automating designer work ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Pochette](https://github.com/zehfernandes/sketch-pochette) — A Sketch plugin that lets you carry your the most used properties close to your mouse ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Artboards Explorer](https://github.com/Hito01/artboards-explorer) — Add utility functionalities to Sketch's artboards ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [StickyGrid](https://github.com/uetchy/Sketch-StickyGrid) — Sketch plugin to make paths be snapped to the grid. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Review](https://github.com/marcelinollano/sketch-review) — Review designs using Emoji. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [labelizING](https://github.com/nOograss/labelizING) — Extract, replace and download labels from sketch file ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Text Styles Manager](https://gum.co/sketch-text-styles-manager) — A fast and easy way to manage all your Text Styles. No more hassle with long and complex names, or renaming tons of styles because you misspelled a folder name. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Layer Styles Manager](https://gumroad.com/l/sketch-shared-styles-manager) — A fast and easy way to manage all your layer styles. No more hassle with long and complex style names, or renaming tons of styles because you misspelled a folder name. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Manager Plugin](https://www.sketchmanager.com) — The easiest way to manager your Symbols, Text styles and Layer styles. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Bounding Boxer](https://github.com/preciousforever/sketch-bounding-boxer) — A simple plugin to toggle visibility of 'boundingBox' layers in a Sketch document. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Bound with Box](https://github.com/lewishowles/sketch-bound-with-box) — Draws a rectangle of the same size, shape, and position as the selected layer, with possible padding. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Sketch Show Bounding Boxes](https://github.com/pravdomil/Sketch-Show-Bounding-Boxes) — Sketch plugin that shows bounding boxes of all layers ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Fix Sketch Trackpad Speed](https://github.com/pravdomil/FixSketchTrackpadSpeed) — Speed up your scrolling across all artboards ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [SketchTurbo](https://github.com/usagimaru/SketchTurbo) — A plugin for Sketch that adjusts scroll speed on a canvas. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Figma Walker](https://www.figma.com/c/plugin/732773762837487095) — Figma Walker is a new launcher for Figma. You can take any actions you want from a single input field. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Pixel Perfect](https://www.figma.com/c/plugin/741300632449121669) — Forgot to turn back on Snap to Pixel Grid? Not a problem. Select any layers you want to snap back to the pixel grid, and presto, their position and size are rounded back to nice round numbers. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Roller · Design Linter · Toybox](https://www.figma.com/c/plugin/751892393146479981) — Roller is the first-ever Design Linter - giving you the power to automatically find and fix style inconsistencies in your files. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Scripter](https://www.figma.com/c/plugin/757836922707087381) — Speed up your workflow or experiment with the Figma API through scripts. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Page Jumper](https://www.figma.com/c/plugin/747923738427824830) — Quicky jumps to any page in your file with this handy utility plugin. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Deep Focus](https://www.figma.com/c/plugin/750049905488948276) — Listen to your favorite playlist.- Preloaded with 'Deep Focus' playlist. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Design Inspo](https://www.figma.com/c/plugin/738775292786594626) — The best way to quickly look for design inspiration while you work. Search with text and colour to get quick inspiration and colour palettes from across the web without ever leaving your artboard. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [DPI 2 Pixels](https://www.figma.com/c/plugin/743928147588245448) — DPI to Pixel is here to help you turn the best cloud-based design tool into your next print project tool. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Split Shape](https://www.figma.com/c/plugin/746565487016656360) — Split your shapes, text layers, groups and frames into multiple instances. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Spellchecker](https://www.figma.com/c/plugin/738839069237725273) — Speller helps to find and correct spelling errors in Russian, Ukrainian or English text. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Spelll - Spell Check for Figma](https://www.figma.com/c/plugin/754026612866636376) — This plugin gives Figma spell-checking super powers similar to that of Google Docs. ![figma.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/figma.svg) * [Experience Generator](https://www.unykvis.com/en/contactos) — Generate entire groups of artboards for each experience and device selected with every artboard needed for that specific experience, and defined sizes for the device resolution. ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg) * [Artboard Quick Navigate](https://github.com/peterflynn/xd-artboard-quicknav) — Quickly jump view between artboards, searching by name. This plugin is open source and under 200 lines of code! ![adobe-xd.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/adobe-xd.svg)
### Zoom Enhancement * [Zoom Alert](https://github.com/nathco/Zoom-Alert) — Sketch.app plugin for showing zoom notifications ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Bookmark](https://github.com/Arkkimaagi/Bookmark) — Bookmark your place and zoom in Sketch.app ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Artboardzoom](https://github.com/Arkkimaagi/ArtboardZoom) — "Zoom" to currently selected Artboard. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg) * [Custom Zoom](https://github.com/alexkaessner/custom-zoom-sketch) — Zoom your document to a custom zoom level. ![sketch.svg](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Media/sketch.svg)
### Addendum (Reference & Inspiration) Awesome Design Tools & Plugins is curated by [Lisa Dziuba](https://twitter.com/LisaDziuba) & [Valia Havruliyk](https://twitter.com/ValiaHavryliuk) from Flawless team. And it was hugely inspired by articles from the design community and Prototypr.io Toolbox made by our good friend Graeme Fulton. If you found some great design tool, please [suggest it](https://github.com/LisaDziuba/Awesome-Design-Tools/blob/master/Contribution_Guidelines.md). Thanks for making this project awesome :)