Custom Rounded appbar in flutter


Screenshot of Customise Appbar :

enter image description here

I want to make a Custom app bar like in the photo
Can anybody help me in creating this i had searched a lot but not found anywhere


I don’t think it is a rounded appBar but a rounded container below it.

I have added backgroundColor in the Scaffold which matches with the background color of AppBar. Also, I have set the elevation of AppBar to 0 to prevent shadow.

enter image description here

import 'package:flutter/material.dart';

class TempMyApp extends StatelessWidget {
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Test App',
      home: Scaffold(
        backgroundColor: Colors.indigo.shade800,
        appBar: AppBar(
          title: Text(
            'Test App',
          elevation: 0,
          backgroundColor: Colors.indigo.shade800,
        body: Container(
          decoration: BoxDecoration(
            borderRadius: BorderRadius.only(
              topLeft: Radius.circular(60),
              topRight: Radius.circular(60),
            color: Colors.white,

Answered By – Ashesh Shrestha

Answer Checked By – Robin (FlutterFixes Admin)

Leave a Reply

Your email address will not be published. Required fields are marked *