Height Comparison — Manual

What it does

Builds a side-by-side height comparison image in the browser. Set each person's
name, height and color, then save or share the result. Everything runs in your
browser — nothing you enter and no image is uploaded or stored anywhere.

How to use it

The editor has four tabs: Image, Settings, Data, and Simple syntax. Choose the unit and watermark in
Settings, edit people in Data, and preview or save the result in Image.

  1. Open the Height Comparison tool.
  2. Enter a name and height in the form, and press "Add" to include more people. You can pick a color too.
  3. The preview image updates automatically as you type. It has two panels: "Custom order" on top and "By height" below.
  4. Use "↑" / "↓" on each row to reorder, and "Remove" to delete a person.
  5. "Units" switches between cm and ft/in input. Switching units discards the people you've entered rather than converting them.
  6. Choose whether to show the site credit, then use "Open image in new tab" to view or save the image. "Copy data sharing URL" copies a URL that restores the current setup. "Share" hands the image and the URL to your device's share sheet (shown only where the Web Share API is available; where file attachments aren't supported it shares just the URL and text).

Simple syntax

Settings and people can be edited together. Heights are always written in centimeters.

unit: cm
watermark: show

Taro | 170 | #7c9eff
Hanako | 160 | #ffb86b

The sharing URL contains #v1: followed by a compressed copy of this entire text.

Spec

Sharing URL

The current setup is reflected in the URL; opening that URL restores the same setup.
The sharing URL contains #v1:… and can be shared or bookmarked.

Input ranges

Field Range
Height (cm mode) 1–1000, step 1
Feet (ft/in mode) 0–9, integer
Inches (ft/in mode) 0–11, integer

Non-numeric input, or input of 0 or less, is ignored when adding.

Units (cm / ft/in)

  • The unit is fixed when the page opens and only changes via the "Units" toggle. Heights you've already entered are never auto-converted from one unit to the other while you work.
  • The internal value is always in cm. ft/in is converted only when taking input and when displaying; the ft/in display rounds to the nearest whole inch (if rounding pushes inches to 12, it carries one foot).
  • The "Units" toggle discards all entered people and starts over (behind a confirmation dialog) rather than converting them to the new unit — so a fractional cm value isn't forced into whole-number ft/in input.
  • Gridlines are drawn every 5cm / 10cm in cm mode, and every 3in / 1ft in ft/in mode.

Output image

  • Regardless of the number of people or their heights, the outer frame is a fixed
    size (880×820, exported at 2× as a 1760×1640 PNG). Content is scaled and packed
    to fit that fixed frame.
  • Each person's name is drawn inside their body. Names containing Japanese/CJK
    characters are stacked one character per line; names in Latin script are drawn
    on a single line rotated 90° so they still read left-to-right.
  • Height appears in parentheses below the name inside the body, rotated clockwise
    90°. It follows the selected unit, such as (166cm) or (5'5").
  • A Made with abstiro.com watermark is placed at the bottom-right by default. Use the option above the image button to show or hide it.
  • Open image in a new tab to view or save the generated image.

Sharing

  • Copy data sharing URL: copies a URL that fully restores the current setup to the clipboard. Available everywhere.
  • Share: passes the PNG plus the current URL and text to navigator.share. The button is hidden on browsers without the Web Share API. Where file attachments aren't supported (e.g. desktop) it shares just the URL and text. Cancelling the share does nothing.
  • Neither button sends anything to a server; the data is only handed to the target app.