Format Dates in Flutter

Last Updated : 21 Apr, 2025

The Dart in-built method, for formatting, dates in Flutter according to the requirements is very limited and restrictive. While dealing with dates it should be in human-readable format but unfortunately, there's no way of formatting dates in flutter unless you make use of a third-party package.

In this article, we will look into one such package known as the intl package.

- Using the intl package

Add the following dependencies to your pubspec.yaml file, you can find the latest dependencies here.

Dart

dependencies:
    flutter:
       sdk: flutter
    intl: ^0.20.2

- Add using the terminal

You can also get the latest intl library using the terminal easily:

flutter pub add intl

- Import it

That's it, now import the intl package in your Dart code:

import 'package:intl/intl.dart';

Still, if you face any error using intl, simply use the following command:

flutter pub get

Now let's take a look at the below example.

Example:

In the below code we will not be using the intl package for formatting. Also, take a look at the output of the below code.

Dart

import 'package:flutter/material.dart';

void main() {
  runApp(dateDemo());
}

class dateDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      
      // browser tab title
      title: "Geeksforgeeks",
      
      // Body
      home: Scaffold(   
        
          // AppBar
          appBar: AppBar(
            
            // AppBar color
            backgroundColor: Colors.green.shade900,
            
            // AppBar title
            title: Text("Geeksforgeeks"),           
          ),
        
          // Container or Wrapper
          body: Container(                         
            margin: EdgeInsets.fromLTRB(95, 80, 0, 0), 
            
            // printing text on screen
            child: Text(                           
              
              // Formatted Date
              // Builtin format / without formatting
              DateTime.now().toString(),         
              style: TextStyle(
                
                  // Styling text
                  fontWeight: FontWeight.bold, fontSize: 30), 
            ),
          )),
    );
  }
}

Output:

Now let's make use of the intl package for formatting the date.

Dart

import 'package:flutter/material.dart';
import 'package:intl/intl.dart';

void main() {
  runApp(dateDemo());
}

class dateDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "Geeksforgeeks",
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(
          backgroundColor: Colors.green.shade900,
          foregroundColor: Colors.white,
          title: Text("Geeksforgeeks"),
        ),

        body: Center(
          child: Text(
            
            // Date format
            DateFormat.yMMMEd().format(DateTime.now()),
            style: TextStyle(fontWeight: FontWeight.bold, fontSize: 30),
          ),
        ),
      ),
    );
  }
}

Output:

More DateFormat Functions

DateFormat class in intl provides a lot of functions to format dates accordingly as shown:

Use	Description	Example
DateFormat.yMMMEd().format(date)	Day Name ,Month Name ,Date,Year	Fri, Sep 3, 2021
DateFormat.MEd().format(date)	Day Name,Month/Date in Numbers	Fri , 9/3
DateFormat.MMMMEEEEd().format(date))	DayName,MonthName Date	Friday ,September 3
DateFormat.yMMMMEEEEd().format(date))	DayName ,MonthName Date,Year	Friday ,September 3,2021
DateFormat.EEEE().format(date)	Full DayName only	Friday
DateFormat.E().format(date)	Short DayName	Fri
DateFormat.M().format(date)	Month-Number	9
DateFormat.MMM().format(date)	Short MonthName	Sep
DateFormat.LLLL().format(date)	Full MonthName	September
DateFormat.j().format(date)	Current Time only	4 PM

Example:

Dart

import 'package:flutter/material.dart';
import 'package:intl/intl.dart';

void main() {
  runApp(dateDemo());
}

class dateDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "Date-Demo",
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(
          backgroundColor: Colors.green.shade900,
          foregroundColor: Colors.white,
          title: Text("Geeksforgeeks"),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              
              // Day,Month Date,Year
              Text(
                DateFormat.yMMMEd().format(DateTime.now()),
                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20),
              ),
              
              // Day,Month/Date in Numbers
              Text(
                DateFormat.MEd().format(DateTime.now()),
                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20),
              ),
              
              // DayName,MonthName Date
              Text(
                DateFormat.MMMMEEEEd().format(DateTime.now()),
                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20),
              ),
              
              // DayName,MonthName Date,Year
              Text(
                DateFormat.yMMMMEEEEd().format(DateTime.now()),
                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20),
              ),
              
              // Full DayName only
              Text(
                DateFormat.EEEE().format(DateTime.now()),
                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20),
              ),
              
              // Short DayName
              Text(
                DateFormat.E().format(DateTime.now()),
                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20),
              ),
              
              // Month-Number
              Text(
                DateFormat.M().format(DateTime.now()),
                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20),
              ),
              
              // short MonthName
              Text(
                DateFormat.MMM().format(DateTime.now()),
                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20),
              ),
              
              // full MonthName
              Text(
                DateFormat.LLLL().format(DateTime.now()),
                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20),
              ),
              
              // Current Time only
              Text(
                DateFormat.j().format(DateTime.now()),
                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20),
              ),
            ],
          ),
        ),
      ),
    );
  }
}