Giter Club home page Giter Club logo

sketch-text-tools's Introduction

sketch-text-tools

Compatible with Sketch 43.1

This plugin eases working with typography in Sketch. It enables displaying font metrics, aligning text-layers to text-layers or other layers relative to baseline, x-height and cap-height. Baseline grid reference layers can be extracted from text-layers or build with custom configurations. Text-layers can be split into several columns with specific gutter widths.

Commands

1. Create Font Metrics
2. Align Text
3. Create Baseline Layer
4. Count Characters Per Line
5. Columnize


Font Metric

Extracts font metrics from text layer fonts. Creates a reference layer displaying the fonts baseline, ascent, descent, x-height and cap-height as well as the default line-height relative to the font-size used ( blue ). Furthermore the x-height and cap-height center get displayed ( red ). Metrics get extracted for the first line of a text layer. width equals text-layer width.

Align text Align text

Aligns selected text-layers and non-text-layers. Alignment is based on a metric reference, e.g. centering all layers on a shared baseline or aligning all layers at the x-height top.

Option Description
Reference The reference metric to be used. (Baseline,X-Height,Cap-Height)
Reference Alignment Alignment to the reference. (e.g. to x-height center or top)
Layer Alignment Alignment of text-layers and non-text-layers
Pixel Precision Precision of resulting layer y position px

Baseline Layer Baseline Layer Baseline Layer

Creates a baseline reference layer either from text-layers or from configuration.

Option Description
Layer Width The width of the baseline layer ('auto' on text-layers sets width to text-layer width)
Line Height The line height ('auto' on text-layers sets line-height to text-layer line-height )
Num Lines The number of lines to display ('auto' on text-layers sets number of lines relative to text-layer height)
½ Step If enabled an additional guide displaying half the line-height will be added
Shared Style Choose a custom styling via shared styles

Counts characters of all lines within a text layer. Shows the minimum and maximum amount of characters, the line indices for both values as well as the total amount of characters.

Columnize

Splits a text-layer into multiple columns. Number of columns, gutter width and column height can be specified.

Sorry, no hyphenation at the moment.

sketch-text-tools's People

Contributors

automat avatar detj avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

sketch-text-tools's Issues

Not working with 49.3

I was so excited to see this plugin, pretty please with a cherry on the top can you update?

Support Sketch 45 plugin update system

Hi there!

This is a quick note to remind you that Sketch 45 will include a plugin update system.

It would be awesome if you could add support to it (it's really easy!) before Sketch 45 comes out. Ideally, you should release an update for your plugin while we're still in Sketch 44, so your users will have a nice & easy experience when 45 is released.

For more details, please check http://sketchplugins.com/d/229-updating-plugins and http://developer.sketchapp.com/introduction/updating-plugins/

Thanks in advance!

Coolumn height?

Hi,
how can I create Columns width auto height orientating on the text length?
Or how can I resize the column after I use the text-tools? I can only change the size to a smaller one than the text tool has created the column.

KR

Deprecation warning

Hi there. As you probably know, [MSTextLayer lineSpacing] has been deprecated for a while, and it will be removed in Sketch v40. Please update your Plugin to use [MSTextLayer lineHeight] instead, or it won't work in the next release :)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.