Skip to main content
VVertex Solutions
PDF ToolsImage ToolsText ToolsCalculatorsDeveloperBlog
VVertex Solutions

Fast, free, browser-based online tools for PDF, images, text, calculators, and developers. No signup required.

Popular Tools

  • Merge PDF
  • Compress Image
  • JSON Formatter
  • BMI Calculator
  • Regex Tester

Categories

  • PDF Tools
  • Image Tools
  • Text Tools
  • Calculators
  • Developer Tools

Company

  • About
  • Editorial Standards
  • How We Verify Tools
  • Disclaimer
  • Privacy Policy
  • Terms of Service
  • Contact
  • Blog
  • RSS Feed

© 2026 Vertex Solutions. All rights reserved.

Free tools. No signup. Privacy first.

  1. Home
  2. Blog
  3. JPEG Artifacts Explained — What Those Blocks and Halos Actually Are
Imageinformational6 min readPublished 2026-04-07 · Updated 2026-09-06

JPEG Artifacts Explained — What Those Blocks and Halos Actually Are

JPEG artifacts aren't random glitches — they're predictable side effects of lossy compression. Learn to spot them, avoid them, and fix them before publish.

By Vertex Solutions Editorial Team

Quick answer

A homepage hero can look "pixelated" on mobile even with a large source. The source file was 6000 pixels wide. The problem wasn't resolution — it was a JPEG saved at quality 55, then cropped in a CMS, then re-exported by a "optimize images" plugin at quality 60. Three passes of lossy compression stacked until the sky looked like a chessboard.

A hero can look "pixelated" on mobile even at 6000 px wide if it was saved at quality ~55, cropped in a CMS, then re-exported by an "optimize images" plugin at quality ~60. Three passes of lossy compression can stack until the sky looks like a chessboard — the problem is stacked recompression, not lack of resolution.

Artifacts are the fingerprints of those decisions. Once you know what to look for, you stop blaming the screen.

How JPEG compression creates artifacts

JPEG is lossy. The encoder:

  1. Converts color to frequency data (DCT) in 8×8 blocks
  2. Quantizes — throws away high-frequency detail it judges unimportant
  3. Encodes what's left efficiently

When quantization is aggressive (low quality setting), blocks don't blend smoothly. Edges ring. Gradients staircase. Fine texture turns to mush.

This is physics of the format, not a bug in your export dialog.

The artifact family reunion

Blocking (macroblocking)

Visible squares in areas that should be smooth — blue sky, beige wall, skin shadow. Most obvious at quality below ~70 on large displays.

Fix: Raise quality, switch to WebP at equal bytes, or add subtle real noise in source (rare trick for photographers).

Color banding

Skies shift in discrete stripes instead of smooth gradients. JPEG shares blame with 8-bit color depth; compression makes it worse.

Fix: Higher quality, slight gaussian blur on sky only before export (controversial but used in production), or WebP.

Ringing (halos)

Bright or dark outlines along sharp edges — white shirt against black jacket, text on screenshot saved as JPEG.

Fix: Don't JPEG screenshots with text. Use PNG or WebP lossless. For photos, moderate quality bump.

Mosquito noise

Fuzzy speckles swarming high-contrast edges — hair against sky, tree branches against clouds. Named because it looks like insects.

Fix: Less aggressive compression; avoid sharpening after heavy JPEG.

Color bleeding

Chroma subsampling merges color channels aggressively (common 4:2:0). Red text on white gets pink fringes; fine colored patterns smear.

Fix: Export with 4:4:4 chroma if your tool allows; use PNG for graphics with colored text.

Why artifacts stack

Every Save As JPEG re-quantizes already-quantized data. Social platforms, CMS plugins, and email clients often recompress on upload.

Camera JPEG (Q92) → Canva export (Q80) → CMS "optimize" (Q75) → Instagram re-encode

Each hop adds damage. Workflow rule: one lossy hop from master.

Keep a TIFF or high-quality master. Export web JPEG once via Compress Image. Never re-save the web file.

Step-by-step artifact audit

  1. Open suspect image at 100% zoom — not fit-to-window.
  2. Pan across sky, shadow, skin, fine pattern — note blocks and banding.
  3. Check edges — halos and mosquitoes near contrast boundaries.
  4. Trace provenance — how many times was this JPEG saved?
  5. Re-export from best master at quality 82–88 (adjust after visual check).
  6. Compare bytes — if new file is only 10% larger but artifacts gone, ship it.
  7. Disable CMS double compression if plugin re-encodes uploads blindly.

If master is lost and artifacts are severe, reshoot or re-source — denoise AI helps marginally, not magically.

Format comparison when artifacts matter

| Content | Safer format | Why | |---------|--------------|-----| | Photo hero | WebP or JPEG Q85+ | Size vs quality balance | | Screenshot | PNG / WebP lossless | Text edges | | Logo on photo | PNG overlay, don't bake JPEG | Halos on logo edge | | Thumbnail | JPEG Q70–75 | Small display hides sins | | Archival | TIFF / RAW | No generation loss |

See PNG vs JPG Guide for graphics vs photos. WebP vs JPG for modern photo delivery.

Real-world examples

Band poster — fluorescent gradients banded at Q65. Q82 fixed banding; file grew 40 KB. Worth it.

LinkedIn headshot — LinkedIn recompressed; starting from Q95 instead of Q75 kept skin acceptable post-upload.

Blog inline — 1200 px wide, Q80, no visible artifacts on retina phone. Same image at Q60: mosquito noise on hair.

Numbers shift per image. Your zoom test is the spec.

Common mistakes

Saving screenshots as JPEG
Text becomes soup. Use PNG.

Editing JPEGs in layers
Each flatten + save adds a generation. Edit lossless working file.

Assuming high resolution hides low quality
6000×4000 at Q50 still blocks on zoom.

Over-sharpening after compress
Sharpening amplifies ringing halos.

Ignoring resize order
Resize from master, then compress once — not compress then resize the damaged file.

Privacy note

Artifact inspection is local work. Re-exporting through random "JPEG fixer" websites uploads your image. Use browser tools — Compress Image, JPG to PNG for lossless hop if needed — that process on-device.

Alternatives when JPEG won't behave

  • WebP lossy — often cleaner at same file size (WebP Converter)
  • PNG — UI, diagrams, anything with text
  • AVIF — newer, excellent efficiency, check fallback plan
  • Serve larger quality once — better one 280 KB clean file than two 140 KB garbage passes

Read how image compression affects quality for the quality slider mindset.

Troubleshooting

What do JPEG artifacts look like? Common signs include 8×8 pixel blocks in flat areas, color banding in skies, ringing halos around sharp edges, and mosquito noise — speckled patterns near high-contrast boundaries. They worsen each time you re-save a JPEG.

Can you remove JPEG artifacts after the fact? You can soften them slightly with denoise tools, but you cannot recover discarded data. Prevention — higher quality on first export and avoiding re-compression — beats repair.

Why does JPEG create square blocks? JPEG divides the image into 8×8 pixel blocks and compresses each separately. At low quality, block boundaries become visible, especially in smooth regions like walls and skies.

Limitations

When not to use this approach

Conclusion

JPEG artifacts are blocky skies, banded gradients, halos, and mosquito noise — the cost of aggressive lossy compression and repeated saves. Spot them at 100% zoom, re-export once from a real master, pick the right format for text and UI, and stop letting plugins compress your compress.

You can't polish a third-generation JPEG back to RAW. You can stop making generation four.

Related Tools

Free browser-based tools referenced in this article.

Featured
Compress Image
Reduce image file size while maintaining quality.
JPG to PNG
Convert JPG images to PNG format.
New
WebP Converter
Convert images to and from WebP format.

Key takeaways

  • What do JPEG artifacts look like: Common signs include 8×8 pixel blocks in flat areas, color banding in skies, ringing halos around sharp edges, and mosquito noise — speckled patterns near high-contrast boundaries.
  • Can you remove JPEG artifacts after the fact: You can soften them slightly with denoise tools, but you cannot recover discarded data.
  • Why does JPEG create square blocks: JPEG divides the image into 8×8 pixel blocks and compresses each separately.

Frequently Asked Questions

Common questions answered to help you get the most from this tool.

Vertex Solutions Editorial Team

Guides and articles are produced under this collective byline — not attributed to invented individual experts. We research tool workflows, check steps against live tools where practical, and avoid fabricated personal stories, client anecdotes, or invented test results.

  • Content research — Topics come from real tool workflows, common questions, and gaps in existing guides.
  • Technical review — Steps, tool behavior, and examples are checked against the live tools on this site before publication when practical.
  • Fact checking — Claims about formats, browser behavior, and calculator outputs are verified against documentation and tested sample inputs where practical.
  • Updates — Pages may be revised when tools, official guidance, or browser behavior changes. There is no fixed review calendar for every URL.
  • Corrections — Report factual errors via Contact.

Full policy: Editorial Standards. Tool checks: How we verify tools.

imagejpegjpgartifactscompressionquality
Back to all articles

On this page

  • How JPEG compression creates artifacts
  • The artifact family reunion
  • Blocking (macroblocking)
  • Color banding
  • Ringing (halos)
  • Mosquito noise
  • Color bleeding
  • Why artifacts stack
  • Step-by-step artifact audit
  • Format comparison when artifacts matter
  • Real-world examples
  • Common mistakes
  • Privacy note
  • Alternatives when JPEG won't behave
  • Troubleshooting
  • Limitations
  • When not to use this approach
  • Conclusion

Related Articles

  • Common Mistakes When Resizing Images for the Web
  • How to Remove Image Backgrounds Without Photoshop
  • WebP vs JPG: Which Image Format Should You Use?