Back to Plugins
Text Crop

Text Crop

Trim the whitespace off text - layout typography relative to the baseline and capheight

cropleadingspacingtext croplayoutcapsizeline heightleading trimgaptypographyfontwhitespace

Plugin Preview

Text Crop preview

About this plugin

Text Crop is a plugin that removes the whitespace around text boxes. No longer will you have extra leading above and below your text. Layout designs in the way you intended.


This plugin creates a component, which dynamically resizes to ensure text is the right size. You can use any styles you want in the component, just hit 'Crop'.


Fully responsive, the text crop component works inside any auto layout frames, and even works inside nested components!


Feel free to use this in your design system as a component, it even works across libraries


Instructions

An in-depth guide has been kindly written by the James Newson from the NewsKit Design Team.


  1. Create the Text Crop components by running the command 'Create Components'
  2. Make an instance of the crop component. Change any of the text properties, the plugin will handle them.
  3. For paragraphs use the variant "multi-line" switch
  4. Open the Instance cropping panel. 'Crop Instances'
  5. Set your cropping preferences, and click "Crop"


Text Crop can crop multiple selections, and crop entire pages of Text Crop instances using the relaunch buttons in the side panel.

Plugin Details

Version29
CreatedMarch 11, 2021
Last UpdatedJanuary 12, 2023
Categoryfonts-typography
CreatorLuke Finch
Stats2536 installs, 112 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:dist/ui.html
  • main:dist/code.js
  • Editor Types:
    figma