PRACTICAL IMAGE EDITING
Remove Placeholder Text from a Static UI Mockup Without Losing the Controls
A static UI mockup may contain temporary copy such as “Sample name” or “Button label” that you want to replace in the next design pass. First decide whether those words are editable design objects or flattened pixels. Removing them should not erase the boundary or state that explains the control. TextWiper prepares an image copy; it does not update the working interface, its accessible labels or its interaction behavior.
Published 2026-10-21 · Updated
1. Define the placeholder and the state you intend to show
Use a mockup you created or are authorized to revise. List each disposable phrase and its role: a card title, a sample value, a button caption or a temporary instruction. Distinguish placeholder copy from a necessary field label, error message, loading state or disabled-action explanation. Emptying all visible text can remove the information a reviewer needs to understand the screen.
Keep the original version and describe why you need a text-free copy. If the goal is a working interface, edit the source design or application rather than repairing its screenshot. If the goal is an illustration for new wording, record which states must remain visible and plan to add verified replacement text in a suitable source application.
2. Take the source-document route when the words are editable
On a duplicate of the correct design file, select the actual text object and temporarily hide it. Check whether it belongs to a button component, input field or repeating card. Removing a component instead of its text can also remove the control background, spacing and icon. The exact controls depend on your design application; TextWiper has no component or layer inspector.
Inspect the resulting button bounds, card layout and selected state before exporting. A text object can affect layout in the source, so hiding it does not automatically leave the same geometry. Compare with the intended mockup version. Reopen the exported image to confirm that the right screen, theme, viewport and control arrangement reached the file.
3. Use a pixel mask only for an appropriate flattened copy
If a usable source is unavailable, open an authorized JPG, PNG or still WebP. Find text is optional and asks for recognition upload permission. It may combine a card title with a nearby badge or detect genuine labels as well as placeholders. Nothing starts selected, and recognition does not understand your component hierarchy.
- Zoom into one disposable phrase and identify the full button, card or field that contains it.
- Use Area only for an isolated text block with margin from borders, icons and state indicators; use Brush close to them.
- Use Erase to withdraw green coverage from dividers, input underlines and button corners.
- Protect clear, visible control details beside the text. An overlapping letter and border cannot be separated by protection alone.
- Check the whole control before repair, not just the word that is meant to disappear.
4. Compare repair candidates without inventing interface structure
Quick repair can be a candidate for a small phrase on a flat panel or button fill. Smart repair may be worth comparing on a textured illustration, using the same reviewed mask. Neither knows whether a rounded rectangle is clickable, a dot is a status indicator or an underline is an input. Reject a smooth patch that changes those visible cues.
Manual selection, Quick repair, Smart repair and downloads are free during beta without an account. Whole-image automatic cleanup is a separate limited single-image sign-in trial with its own permission and available allowance. It can modify the entire image and is not a UI-component preservation mode. This local placeholder task can follow the manual route without that trial.
5. Review each button and each card as a complete unit
The full repaired result appears by default. For a button, inspect all corners, its border, fill, icon, focus outline and enabled or disabled appearance. For a card, inspect its outer rectangle, divider, image area, badge and spacing to the next card. For an input, check the field boundary, unit suffix, selected value and any hint that is intentionally retained.
Then view the entire screen at presentation size. Make sure a blank button is clearly an unfinished design area rather than a claim about a finished product. Use Show comparison to locate edits and Hide comparison to judge the full copy. If you change the mask, repair again from the original; the earlier result is invalidated by that selection change.
6. Handoff an illustration, or return to the actual UI source
Download a reviewed PNG and reopen that exact file. Supply the unchanged mockup and a short list of removed placeholders with it. Add new copy in the source design application and check the resulting line lengths and control sizes there. An image export cannot supply accessible names, validation rules, hover states or responsive behavior for the working product.
Stop if the placeholder covers an essential icon, the repair changes a selected state, or the intended control cannot be explained without its label. Obtain the source or keep the wording until the next content pass. Do not present a cleaner static mockup as evidence that the live UI was changed or that the new interaction has been tested.