note OGP & Header Image Size Guide (1280x670)
note articles use 1280x670 OGP and header images. Learn the exact sizes and how to crop without cutting off text or faces.
note.com is one of Japan's largest publishing platforms and it uses a slightly non-standard 1280×670 (~1.91:1) image size for article headers and OGP previews. That means your article thumbnail needs to survive both note's own header renderer and every OGP unfurl on X, Slack, LINE, and Discord. Getting it wrong causes letterboxing or cropped titles. This guide covers every note image size, includes the profile header and avatar dimensions, and shows how to pre-crop with ShareMint so titles and faces stay inside the visible area on both desktop and mobile.
| Placement | Size (px) | Notes |
|---|---|---|
| Header / OGP | 1280 × 670 | ~1.91:1 — SNS link previews |
| Profile header | 1920 × 720 | Wide banner |
| Avatar | 600 × 600 | 1:1 circle render |
Steps
Know the note image sizes
note.com header / OGP image: 1280x670 pixels (roughly 1.91:1). Profile header: 1920x720. Avatar: 600x600. The 1280x670 is what shows in social link previews.
Pick a high-resolution source
Start from a 2x source (2560x1340 or higher) so the down-sized 1280x670 export stays crisp on Retina displays.
Resize and crop in ShareMint
Drop the image into ShareMint, choose the note OGP / Custom 1280x670 preset, and click on the focal subject — usually the title text or main face.
Export as JPEG at 90%
JPEG at 90% quality balances file size and clarity. note compresses uploads, so a clean 90% source survives better than a 100% one.
Upload as your note header
Open your note article editor, upload the resized image as the header, and publish. The same image will appear in OGP link previews on X, Slack, and elsewhere.
Try It Now
No sign-up required. Free. 100% browser-based. Images never leave your device.
Create note headerFAQ
Why 1280x670 specifically?
note settled on 1280x670 to match the 1.91:1 OGP standard while leaving room for note's own header rendering. Anything wider gets letterboxed; anything taller gets cropped.
Will my header look bad on mobile?
note serves a center-cropped variant on mobile. Use ShareMint's focal point so your title or subject stays visible in the mobile crop.
Can I use text on my header image?
Yes, but keep important text within the central 70% of the image. Edge text often gets cropped on mobile and in OGP previews.
How big should the file be?
Aim for under 500KB. note compresses anyway, and smaller files load faster for first-time visitors.