Daily Summary Poster Generator（Daily Log Maker）

A lightweight web tool for laying out daily reflections, tasks, and work or study summaries as a polished long poster, then saving it as a high-resolution PNG.

Features

• Visual editing: change the date, heading, and daily quote in the left panel, with a live preview on the right.
• Formatting toolbar: bold text, bullet lists, five highlight colors, gray blocks, and red strikethrough.
• Themed cards: choose a color, enter an emoji and section title, and add an editable card to the canvas.
• Long-image export: capture content beyond the viewport as a complete high-resolution PNG with a transparent background.
• No build setup: open the HTML file directly; html2canvas and font resources are loaded through CDNs.

Quick start

1. Open Daily Log Maker.html。
2. Enter the date, heading, and daily quote in the left panel; the canvas updates immediately.
3. Add a section:
   • Choose a theme color.
   • Enter an emoji and section title.
   • Click “+ 添加到画布” (add to canvas), then edit and format the card body directly.
4. Click “保存图片” (save image) in the left panel to generate and download a long image. Its filename follows the pattern 每日记录_Long_YYYY.MM.DD.png）。

Tips

• Select text before applying bold, highlighting, or strikethrough with the toolbar.
• To create a list, enter several lines in the body, then click the list button to convert them to bullets.
• The “✕” at the top right of a card removes only that card.
• The exported PNG has a transparent background, making it convenient to combine with other images or documents.

Technical notes

• The screenshot uses html2canvas from a CDN to capture the canvas. A cloned node is allowed to expand to its full height, preserving long content and avoiding unwanted shadow effects.
• The capture uses scale = 2.5 to balance sharpness and file size on typical screens.
• Card bodies use contenteditable with basic editing commands for common rich-text operations.

Offline use

For fully offline use:

• Replace the CDN copy of html2canvas with a local file, and replace Google Fonts with system fonts or locally hosted font files.
• The export feature can work with the existing page structure.

Browser compatibility

• Recent versions of Chrome, Edge, and Firefox are recommended.
• Very long content increases capture time and memory use. If necessary, lower scale or export the content in sections.

Example output