Displaying 1 to 20 from 27 results

paddy-sketch-plugin - Automated padding, spacing and alignment for your Sketch layers

  •    Javascript

Double click the downloaded file (Paddy.sketchplugin) to install it. If you are using this plugin, please 'star' this project. It's a simple way for me to be able to see how many people are using this, and how much effort I need to put into improving it further.

ProjectVisBug - 🎨 Make any webpage feel like an artboard with this little extension https://visbug

  •    Javascript

Check out the list of features me and other's are wishing for. There's a lot of fun stuff planned or in demand. Cast your vote on a feature, leave some feedback or add clarity. Let's do this design community, I'm looking at you! Make a GitHub account and start dreamin' in the issues area! Help create the tool you need to do your job better.

figma-html - Figma to HTML, CSS, React, Vue, and more!

  •    TypeScript

When exporting Figma to Builder, the plugin requires all elements to be in auto-layout. However, it's not possible to auto-layout a vector. The alternative here is to use Figma's rasterize selection command on your vector. If the output of that is too low-resolution, then you can try this plugin: https://www.figma.com/community/plugin/837846252158418235/Flatten-Selection-to-Bitmap. If you want the Builder end-result to have a vector, then consider this rasterized selection as a placeholder, and swap it back with an SVG in the Builder editor.




Bjango-Templates - Design templates for Android, iOS, macOS, Apple TV (tvOS), Apple Watch (watchOS), Windows, Windows Phone and web favicons

  •    Shell

The Bjango App Icon Templates are a comprehensive set of app icon templates for Photoshop, Illustrator, Sketch, and Affinity Designer. The templates cover Android, iOS, macOS, Apple TV (tvOS), Apple Watch (watchOS), iMessage, Windows, Windows Phone and web favicons. Where possible, they’re set up to automate exporting final production assets. All free and open source, released under the BSD license. Labels — Indicate icon sizes and scale factor. Icon Masks — In cases where the OS masks icons, this group fills non-icon areas, showing you how icons will be masked. Icon Artwork — Place your icon artwork here.

sync.sketchplugin - Keep your design team in sync!

  •    Javascript

Share styles with your team using Google Sheets. Install from Sketch Toolbox (recommended) or download the zip, unzip, and open sync.sketchplugin.

style-dictionary - A build system for creating cross-platform styles.

  •    Javascript

Style once, use everywhere. A Style Dictionary is a system that allows you to define styles once, in a way for any platform or language to consume. A single place to create and edit your styles, and a single command exports these rules to all the places you need them - iOS, Android, CSS, JS, HTML, sketch files, style documentation, etc. It is available as a CLI through npm, but can also be used like any normal node module if you want to extend its functionality.


chromatic-sketch - Sketch plugin for creating good-looking and perceptually uniform gradients and color scales

  •    Javascript

I came across this blog post recently. It opened my eyes to the Lab color space, and how you can use it to create perceptually uniform gradients and color scales with SASS. Chroma.js is the underlying library powering it. Check it out if you want a deeper understanding of the Lab color space and why it's good for creating color scales. Basically, it's a color space that, unlike RGB, was built to mirror the visual response of the human eye. That makes it very well suited for interpolating colors. This command will take the gradient of the selected shape and add new color stops to create a more aesthetically pleasing one.

html-sketchapp-cli - Quickly generate Sketch libraries from HTML documents and living style guides, powered by html-sketchapp

  •    Javascript

Quickly generate Sketch libraries from HTML documents and living style guides, powered by html-sketchapp and Puppeteer. Then run the html-sketchapp command to generate JSON files in html-sketchapp's "Almost Sketch" format, ready to be imported into Sketch.

macOS-UI-Kit - :gem: A retina optimized macOS Sierra UI Kit for Sketch (including Touch Bar)

  •    

This macOS Sierra UI Kit is designed at 1x scale, but with retina displays in mind! So if you open this on a non-retina screen it may looks a little blurry. I think we're missing some good retina UI Kits for Mac, so I've created this based on Apple's fine retina display style. Any feedback is appreciated! Just take a look at the issues, or leave me a comment on dribbble or Product Hunt.

Color-Creator - Photoshop, Sketch and Affinity Designer documents that use base colors to generate larger palettes

  •    

The Bjango Color Creator Templates are a set of Photoshop, Sketch and Affinity Designer documents that use base colors to generate larger palettes. It’s a bit like an advanced color picker, in the form of a document. All free and open source, released under the BSD license.

Greyprint - Templates with pre-made styles to assist icon, symbol, and glyph design.

  •    

Greyprint is a set of templates with pre-made styles to assist icon, symbol, and glyph design. The templates are built for Photoshop, Illustrator, Sketch, Affinity Designer, and Experience Design (XD). Greyprint also includes some handy Illustrator actions for common icon design tasks. All free and open source, released under the BSD license. Pre-made styles are available for Photoshop, Illustrator, Sketch, and Affinity Designer.

salsa - A tool for exporting iOS components into Sketch πŸ“±πŸ’Ž

  •    Swift

Salsa is an open source library that renders iOS views and exports them into a Sketch file. We built Salsa to help bridge the gap between design and engineering in an effort to create a single source of truth for visual styling of UI. Running Salsa inside of an iOS simulator will output two things into a specified directory: a .salsa file and an images folder. You can then pass these two inputs into the salsa command line tool to compile them into a .sketch file.

liveeditor - A simple live HTML, CSS, and JavaScript scratchpad in your browser

  •    HTML

Live Editor is an simple in-browser HTML editor that allows you to write HTML, CSS, and JavaScript in realtime and preview the results on the same page.

haishoku - A development tool for grabbing the dominant color or representative color palette from an image

  •    Python

haishoku is a JP word, it means palette in English. Haishoku is a development tool for grabbing the dominant color or representative color palette from an image, it depends on Python3 and Pillow.

sasha - πŸ‘¨‍πŸ’ΌReduce daily routine with sasha

  •    Swift

Sasha has two main commands - icons and project. Sasha generates icons in needed resolutions as well. For Apple platforms Sasha generates AppIcon.appiconset, which iOS developer can drag and drop right into Images.xcassets without manual icon sorting πŸ‘¨πŸ»‍πŸ’»πŸ‘.






We have large collection of open source products. Follow the tags from Tag Cloud >>


Open source products are scattered around the web. Please provide information about the open source projects you own / you use. Add Projects.