Text Toolbox
Plugin for Adobe XD

The tools you need – at your fingertips

Text Toolbox is your little helper when it comes to dealing with text layers in Adobe XD. With its functions being easily accessible with a keyboard shortcut, it automates otherwise laborious tasks leaving you more time for the creative side of UX-Design.

Current features:

• Trim text area height to fit its content
• Insert placeholder text
• Copy basic HTML markup for your text to go from Design to Development fast and easy
• Replace text
• Generate text reports
• Convert text to uppercase

Last but not least, I am continually enhancing existing and thinking of more features, making the toolbox more and more versatile. Because of this, ideas, feature requests, and feedback of any kind are always very much appreciated. If you have any, please tell me, and I'll see how I can accommodate your wishes...

UI-Languages: English, German

Installing the plugin

There are two easy ways to install the plugin. You can either do so via the "Discover plugins" panel inside XD (see the next paragraph) or by downloading a ".xdx" file (see the third paragraph).

To install the plugin via the plugin manager right inside XD (which, among other things, allows you to update plugins easily), you can either follow the link under "Open in XD" after clicking the Download / Install button above or search for the plugin manually by opening XD and going to "Discover plugins" in the plugin menu. After that, the plugin should appear in the window, and you can click install. As soon as the download finishes, the plugin is installed and should be ready to use.

The alternative way to install the plugin is to download a ".xdx" file – a kind of installer for plugins. You can find the .xdx files for the current and previous versions under the "Download as .xdx" section after you click onto Download / Install above. After you've downloaded this file, you merely need to open it – the way you do with every other file as well – and a window of XD should open, asking you whether you wish to install the plugin. As soon as you click install, the plugin gets installed and is ready to use.

Please note that you'll need Adobe XD CC (version 13+) installed to install and use plugins.

Introduction

Frequently asked questions

What do the characters on the buttons (Q, W, E, etc.) mean?

The characters visible on each button show keyboard shortcuts that can be used to quickly access a function (e.g., you can press Q in the main dialog to easily adjust the height of a text area).

Can I adjust the keyboard shortcuts the plugin uses?

Unfortunately, this is not supported at the moment. However, I'm aware that this is a feature that would be useful and therefore, it'll hopefully be available soon.

I tried the "Copy HTML" feature, and the generated code looks completely different than my prototype

This is to be expected since this feature generates HTML markup for your selected layers (e.g. for your texts) but doesn't generate a "ready to use" website (this is neither the goal nor a possibility). The feature aims to make going from design to frontend code a bit easier, not to automate frontend development.

The generated HTML code isn't correct.

Since this feature is currently in an experimental stage, issues can occur. Please feel free to send me a message if you find any bugs. However, please also note that this feature isn't meant as a "copy and paste" solution – you'll always have to check and correct the code manually. It is merely intended to make going from a high fidelity prototype including text to frontend development quickly.

Any (further) questions, issues or feature requests? Please feel free to contact me via the contact form and I'll try my best to help you.