N
NJHTools

JSON to Dart Class (Flutter)

Paste JSON and get Dart model classes with fromJson and toJson methods for every nested object, ready for a Flutter app. Free, no signup, and generated in your browser.

Language

16 lines · processed in your browser, nothing is uploaded

Dart output · root.dart

Generated code appears here.

Example: JSON to Dart

This JSON sample, with the root type named User, produces the Dart below using the default options.

Input JSON
{
  "id": 1024,
  "name": "Ada Lovelace",
  "email": "ada@example.com",
  "active": true,
  "score": 98.5,
  "tags": [
    "admin",
    "beta"
  ],
  "address": {
    "city": "London",
    "postcode": "NW1 6XE"
  }
}
Generated Dart
// To parse this JSON data, do
//
//     final user = userFromJson(jsonString);

import 'dart:convert';

User userFromJson(String str) => User.fromJson(json.decode(str));

String userToJson(User data) => json.encode(data.toJson());

class User {
    final int id;
    final String name;
    final String email;
    final bool active;
    final double score;
    final List<String> tags;
    final Address address;

    User({
        required this.id,
        required this.name,
        required this.email,
        required this.active,
        required this.score,
        required this.tags,
        required this.address,
    });

    factory User.fromJson(Map<String, dynamic> json) => User(
        id: json["id"],
        name: json["name"],
        email: json["email"],
        active: json["active"],
        score: json["score"]?.toDouble(),
        tags: List<String>.from(json["tags"].map((x) => x)),
        address: Address.fromJson(json["address"]),
    );

    Map<String, dynamic> toJson() => {
        "id": id,
        "name": name,
        "email": email,
        "active": active,
        "score": score,
        "tags": List<dynamic>.from(tags.map((x) => x)),
        "address": address.toJson(),
    };
}

class Address {
    final String city;
    final String postcode;

    Address({
        required this.city,
        required this.postcode,
    });

    factory Address.fromJson(Map<String, dynamic> json) => Address(
        city: json["city"],
        postcode: json["postcode"],
    );

    Map<String, dynamic> toJson() => {
        "city": city,
        "postcode": postcode,
    };
}

How to convert JSON to Dart

  1. 1Paste a JSON object or array into the input.
  2. 2Select Dart as the output language.
  3. 3Name the root class, for example Post.
  4. 4Adjust options such as null safety settings if available.
  5. 5Copy the classes into a .dart file under lib/models.

fromJson and toJson in Flutter

Dart has no reflection in Flutter release builds, so models convert JSON by hand: a factory Post.fromJson(Map<String, dynamic> json) constructor and a Map<String, dynamic> toJson() method.

Decode a response with Post.fromJson(jsonDecode(response.body)) using dart:convert, and encode with jsonEncode(post.toJson()).

Generated code vs json_serializable

Hand-written or generated fromJson methods have no build step, which suits small apps. json_serializable generates the same methods with build_runner and keeps them in sync with annotations such as @JsonKey(name: "user_id").

Either way the class shape is the same, so you can start from this output and switch to json_serializable later.

Null safety

With sound null safety, fields that may be missing or null must be nullable (String?). Casting a missing key to a non-nullable type throws at runtime.

JSON numbers can arrive as int or double; cast with (json['price'] as num).toDouble() when a field may be either.

Frequently Asked Questions

How do I convert JSON to a Dart class for Flutter?↓

Paste the JSON, choose Dart and copy the generated classes. Each includes fromJson and toJson methods for use with dart:convert.

Do I still need json_serializable?↓

No. The generated classes work on their own. json_serializable is an alternative if you prefer annotations and a build_runner step.

How are optional fields detected?↓

Types are inferred from the sample you paste. A field becomes optional only if it is missing from some of the objects, so paste an array with several representative records, or mark the field optional by hand after generating.

Does it handle nested lists?↓

Yes. Arrays of objects become List<Item> with a generated Item class, and the fromJson code maps each element.

Is my JSON uploaded to a server?↓

No. The code generator (quicktype) runs entirely in your browser, so the JSON you paste never leaves your device. That makes it safe to use with internal API responses, though you should still strip secrets before sharing generated code.

Last updated: