JSON Formatter

Format and beautify JSON data

JSON Input

Formatted Output

🔐 json-formatter-tutorial Guide

function formatJSON() { const input = document.getElementById('input').value.trim(); if (!input) { showMessage('Please enter JSON data', 'error'); return; } try { const parsed = JSON.parse(input); const formatted = JSON.stringify(parsed, null, 2); document.getElementById('output').value = formatted; showMessage('JSON formatted successfully!', 'success'); } catch (e) { showMessage('Invalid JSON: ' + e.message, 'error'); } } function minifyJSON() { const input = document.getElementById('input').value.trim(); if (!input) { showMessage('Please enter JSON data', 'error'); return; } try { const parsed = JSON.parse(input); const minified = JSON.stringify(parsed); document.getElementById('output').value = minified; showMessage('JSON minified successfully!', 'success'); } catch (e) { showMessage('Invalid JSON: ' + e.message, 'error'); } } function copyOutput() { const output = document.getElementById('output').value; if (!output) { showMessage('No output to copy', 'error'); return; } copyToClipboard(output); } function downloadOutput() { const output = document.getElementById('output').value; if (!output) { showMessage('No output to download', 'error'); return; } downloadText('formatted.json', output); showMessage('JSON downloaded successfully!', 'success'); } function resetForm() { document.getElementById('input').value = ''; document.getElementById('output').value = ''; showMessage('Form reset successfully', 'info'); }