Text to image
Render a paragraph into a PNG: width, height, font size and weight, text color, solid or gradient background, padding, line height, alignment and CJK-aware line wrapping with punctuation rules, plus auto height.
Runs in your browserEvery computation happens in your browser — your data never leaves this device.
With auto height the canvas grows with the text; turn it off to use the fixed height below.
Preview
Image info
What this tool does
- Build quote cards, social share images or newsletter headers: type a paragraph, set size, colours and background, then export a PNG.
- Skip the design tool when all you need is clean text on an image — solid or gradient background, corner radius, padding and alignment are all adjustable.
- No manual line breaks for mixed Chinese and English: widths are estimated as 1 em for CJK and emoji and 0.5 em for everything else, with CJK punctuation rules applied.
- Fit the height to the text so a long quote never leaves a big empty band and a short one is never cropped.
Example
Input
UniKit 是一个即开即用的在线工具站，所有计算都在你的浏览器里完成。 width 640, font size 28, line height 1.6, padding 32, left aligned, auto height
Output
Canvas size: 640 × 154 Lines: 2 Line 1: UniKit 是一个即开即用的在线工具站，所有 Line 2: 计算都在你的浏览器里完成。
Rendering uses the browser Canvas API, so the final pixels are only visible on the page; the line breaking above comes from the layout logic and can be reproduced in the browser.
Frequently asked questions
Why is the automatic line break not exactly where I expected?
Line breaking estimates character widths instead of measuring the real font: CJK and emoji count as 1 em and everything else as 0.5 em, so a proportional font can differ by a character or two. The trade-off is a small inaccuracy in exchange for a result that never waits on font loading and stays reproducible.
"Fit height to text" or a fixed height?
With auto height the canvas is lines × line height plus top and bottom padding, so it always hugs the text. With a fixed height your value is used, but if the text is taller the canvas grows just enough to fit it — content is never cropped.
What are the CJK punctuation rules?
Closing punctuation such as commas, full stops and question marks must not start a line, and opening brackets or quotes must not end one. The wrapper pushes such characters back onto the previous line or forward to the next, so a line never begins with a lone comma.
Why does a small width raise an error?
The width must be larger than the left plus right padding, otherwise the usable content width is zero or negative and no text fits. Increase the width or reduce the padding.
Is the image uploaded anywhere?
No. The text is drawn with the local browser Canvas API and the PNG is created as a local blob; no network request is made at any point.
Keywords：text to image文字转图片文字生成图片quote card自动换行渐变背景png字体