const Picture Exif = () => {

Read photo Exif / GPS and other meta information locally without uploading.
Zero network requests and the raw data never leaves the browser.

40+ local tools · JSON processing · format conversion · encoding and decoding · text assistance

Click or drag in the image (processed locally, not uploaded)

Click or drag in image

quality longest side 格式

ready Volume: 0 B Time taken: 0 ms

UTF-8 Indent: 4 spaces JSON

Select tools

Click Category in the tool library below, and then click Cards. The workspace title will immediately switch to the corresponding capability.

Post content

Glue the JSON, code, or secret text to the left. Most tools will automatically produce results after input, without the need to click "Run".

See the results

The right side is the processing result. JSON Formatting can be switched to "Tree/Visualization". Comparison tools will highlight additions, deletions, and modifications.

Copy or share

Copy the results, download the file, or click "Share" to generate a Hash link. The data is only written in the browser address bar and is not reported to the server.

Tool library menu

Select the module by category, and the cards and sample scenes below will be switched together.

Examples and Scenarios

Current ·JSON Core

Click "Fill" to open the tool and write the sample, and you can directly see the results.

JSON Format

Interface response beautification

Compress JSON Expand indent and cut tree view

{
  "status": "success",
  "code": 200,
  "data": { "user": { "id": 1001, "name": "Ada" }, "list": [1, 2, 3] }
}

JSON Grammar check

Find extra commas

Will mark error lines instead of a general Unexpected token

{
  "ok": true,
  "msg": "多余逗号会报错",
}

JSON5 Analysis

JSON5 → Standard JSON

Comments, single quotes, and trailing commas will be converted to parseable JSON

{
  // 配置注释
  env: 'dev',
  retries: 3,
  hosts: ['a.local', 'b.local',],
}

JSONPath Query

Extract book titles with price > 20

expression$.store.book[?(@.price>20)].title→ Three-body, algorithm

{
  "store": {
    "book": [
      { "title": "三体", "price": 48 },
      { "title": "JSON 手册", "price": 12 },
      { "title": "算法", "price": 88 }
    ]
  }
}

JSON Compare Diff

Two deployment configurations

replicas changed, debug deleted, region added

A old

{"env":"prod","replicas":2,"debug":false}

B new

{"env":"prod","replicas":4,"region":"cn-east"}

JSON Key Sort

Sort keys alphabetically

Nested objects will also be rearranged to facilitate diff

{
  "z": 1,
  "m": 2,
  "a": { "c": 3, "b": 2 }
}

JSON ↔ YAML

JSON → YAML

The direction has been selected JSON → YAML, for K8s draft use

{
  "service": "api",
  "replicas": 2,
  "ports": [80, 443]
}

Generate entity code

JSON → TypeScript

The language is TypeScript, and the nesting will be split into multiple levels of type

{
  "id": 1,
  "name": "Ada",
  "tags": ["dev"],
  "profile": { "city": "Shanghai", "vip": true }
}

JSON ↔ XML

JSON → XML

The direction has been selected JSON → XML, and the root node will be wrapped with a layer of root.

{
  "user": { "name": "Ada", "age": 18, "tags": ["dev", "ops"] }
}

JSON ↔ CSV

JSON → CSV

The direction has been selected JSON → CSV, and the first line is used as the header.

[
  { "id": 1, "name": "Ada" },
  { "id": 2, "name": "Bob" }
]

JSON → SQL INSERT

JSON → INSERT

The table name is selected users

[
  { "id": 1, "name": "Ada" },
  { "id": 2, "name": "Bob" }
]

Camel case/underline

snake_case → camelCase

CamelCase is selected as the target, and the nested key is changed together.

{
  "user_id": 1,
  "nick_name": "Ada",
  "profile_info": { "city_name": "SH" }
}

Code beautification/compression

JS beautification

Type selected JS beautification

function hello(name){if(!name)return;console.log('hi '+name)}

Code beautification/compression

SQL Beautification

Type selected SQL Beautification

select u.id, u.name
from users u
join orders o on u.id = o.user_id
where o.amount > 100
order by o.created_at desc;

Code beautification/compression

CSS Beautification

Type selected CSS Beautification

.box{display:flex;align-items:center;background:#2563eb;padding:8px 16px}

Base64 Encoding

Chinese → Base64

Please use "Base64 decode" instead for decoding.

DevBox Local Toolbox

URL Encoding

Query parameter encoding

Chinese characters and spaces will become %XX

https://api.example.com/search?keyword=格式化 JSON

Hash

SHA-256

The algorithm has been selected SHA-256, the same input summary remains unchanged

hello-devbox

Timestamp

Unix → local time

10 digits in seconds, 13 digits in milliseconds

1710000000

Unicode Chinese to Chinese conversion

Chinese characters → \u

The direction has selected Chinese characters → \u

Hello,DevBox

JWT

Parse Token

After pasting the Token, click Parse. Don't use production keys

header.payload.signature

HTML Escape/Escape

HTML Escape

The direction has been selected to escape to prevent the label from being treated as DOM

<div class="box">A & B</div>

String processing

Remove duplicates by row

The operation has been selected to remove duplicates by row and keep the first occurrence.

Ada
Bob
Ada
Cara

Regular test

extract numbers

expression\d+, flags selected g

order-1001 paid 88
order-1002 paid 12

String processing

word count

Operate selected character/line statistics

Hello JSONNote
JSON 工具箱

Simple JS operation

Run a short piece of JS

Sandbox iframe, don’t post untrusted code

const sum = (a, b) => a + b;
sum(1, 2);

QR code

Text → QR code

After filling in, click "Generate QR Code"

https://jsonnote.com

CSS Gradient generation

Key CSS Gradient

Change the starting point/end point/angle and copy the background

linear-gradient(135deg, #2563eb, #a855f7)

Image compression

local map

Just drag it in without uploading. Adjustable mass and longest side

JPG / PNG / WebP

Instructions for use

Learn when to use which tool by module. Clicking "View Tools" will jump to the corresponding category, and then use the above example to fill in the workspace with one click.

JSON Core

It is most commonly used for interface debugging, log troubleshooting, and configuration comparison. It is recommended to format first to see the structure. If there is a problem with the syntax, use verification to locate the line number.

Paste the response body compressed into one line, select "JSON Format", and the right side will expand; the tree view can directly change the key value. When you need to load from an address, click "Pull" after confirmation (a network request will be initiated).
newspaperUnexpected tokenIf you use "Syntax Check" instead, lines with extra commas and missing parentheses will be marked.
Use "JSON5 parse" for configurations with comments or trailing commas, which will output the standard JSON.
To compare two configurations: open "JSON Compare Diff"; to combine them into one, use "JSON Merge".
Only take some fields: open "JSONPath". Use "JSON Schema" to infer or verify the contract.

If the indent space is changed in "Settings" in the upper right corner, the formatting and key sorting will also change.

View tools

Multi-format conversion and entities

When connecting with operation and maintenance configuration and back-end models, there is no need to go back and forth to the online conversion station.

JSON ↔ YAML / TOML / XML / CSV: Select the direction first, and then paste the source text.
XML needs to be a parsable document; the root node will be wrapped with one layer when JSON→XMLroot.
"Generate entity code" can work with Java, Go, Python, TypeScript, C#, PHP, Kotlin, Swift, Rust, GraphQL, etc.
JSON → SQL INSERT, curl / Postman mutual conversion, camel case underscore change key are all classified into mutual conversions.

If the conversion fails, see the error message on the right; format it first to confirm that JSON is legal and then convert to and from each other, the success rate will be higher.

View tools

Code beautification and text Diff

Post a piece of JS / SQL squeezed into one line, or compare two logs or configuration drafts.

"Code Beautification/Compression" first select the type (JS Beautification, SQL Beautification, etc.), and the results appear on the right.
The compression option will remove comments and redundant whitespace, which is suitable for volume comparison and is not suitable for use as a production builder.
"Text Diff" is any text in the left and right columns, and the difference is highlighted by line. It does not need to be JSON.

The beautification type is switched in the upper right corner of the workspace.

View tools

encoding, hashing, JWT, RSA

All calculated within the browser. Do not use keys, tokens, and plaintext for production, and do not post real privacy information.

Base64 / URL: Encoding and decoding are two tools, be careful not to paste them backwards.
Hash: text or local file; HMAC needs to fill in the key on the right. Integrity first SHA-256 / SHA-512.
JWT: Parsing will give unix/ISO/local time; generation and verification can be HS256 or RS256.
AES-GCM: Password derivation key, ciphertext is JSON. RSA Still "generate the key" first and then decrypt.
Timestamp: purely digital, automatically judged by seconds or milliseconds; you can also use "current time" to type out local and ISO with one click.

The key is only processed locally, do not post production environment data.

View tools

text assistance

Escaping, deduplication, regularization and word counting, suitable for processing lists, log snippets and text to be inserted into the page.

HTML Escape: put<div>Become a solid character that can be safely inserted into the page, or reverse it.
String processing: remove spaces, newlines, upper and lower case, remove duplicates, remove blank lines, character statistics.
Regular test: fill in the regular expression column, select flags in the options, and the matches will be highlighted.

The same tool can remove spaces, case, and split arrays by changing options.

View tools

Other gadgets

Images, QR codes, gradients and short JS are all processed locally and do not go through the server.

Simple JS execution: execute short scripts in sandbox iframe,Do not paste untrusted code.
Image compression/format conversion/Exif: local Canvas or parsing, not uploading.
QR code: Enter text to generate, or drag in an image for recognition.
CSS Gradient: adjust the starting point, end point, angle, and copy the generatedbackgroundstatement.

Images and QR codes are completed in the browser, and the files will not be uploaded.

View tools

Picture How to use Exif

Confirm that the current tool is selected in the tool library below (or switch from the category Tab).
Paste JSON or text into the left input area.
The results are automatically displayed on the right; you can copy, download or click "Share" if needed.

FAQ

Will the data be uploaded to the server?
No. This tool performs calculations within the browser.
No output after pasting?
Most tools automatically output results after input pause for about 120ms; RSA, JWT, pictures, etc. need to click the panel button.

Product documentation

01.Data Security and Local Computing

JSON processing, encoding, decoding, hashing, JWT, RSA, etc. are all done within the browser. original textWill not be submitted to the backend. Keys and private data are still not recommended to be pasted into any online page.

02.Real-time feedback and sharing

The results will be available immediately after inputting anti-shake. Share link to use#tool=&data=Hash Pass parameters and adapt to script evocation to prevent the server from storing your content.

03.Workspace button descriptions

full screen: Hide the top bar and tool library, leaving only the editor.
Share: Encode the current tool and input into the address Hash, and send the complete URL to a colleague to reproduce.
Download: Save the result on the right as a file.
Clear/Copy results: Clear input or write to clipboard.

04.FAQ

Why is there no output after pasting?

RSA, JWT, pictures, gradients, and JS runners need to click the buttons on the panel. The rest of the tools automatically process input after a pause of about 120ms.
JSON Obviously I can understand it, but it says it’s illegal?

Standard JSON disallows comments, single quotes, and trailing commas. Please use JSON5 to parse this type of text, or delete comments first and then format.
Is the sharing link particularly long?

Data is written in Hash, and the size is limited by the length of the browser URL. Please paste large files locally and do not rely on shared links.
Will the dark theme be turned on next time?

The theme, indentation, and font size exist in the local machine localStorage and need to be reset after changing the browser or clearing the site data.

0 ms

No network transmission delay

100%

Pure client operation

40+

local tools module

Select tools

Post content

See the results

Copy or share

Tool library menu

Examples and Scenarios

Instructions for use

JSON Core

Multi-format conversion and entities

Code beautification and text Diff

encoding, hashing, JWT, RSA

text assistance

Other gadgets

Picture How to use Exif

FAQ

Product documentation

01.Data Security and Local Computing

02.Real-time feedback and sharing

03.Workspace button descriptions

04.FAQ

Editor settings