Themes Customize the Theme of the app

This lesson is available for PRO members or as a single course purchase. Sign-in and choose a plan below.
Get Unlimited PRO Access

OR


*Enrollment provides full access to this course (and updates) for life.

Create a file named theme.dart in the root of the project

Example Code

file_type_flutter theme.dart
import 'package:flutter/material.dart';

var appTheme = ThemeData(
  bottomAppBarTheme: const BottomAppBarTheme(
    color: Colors.black87,
  ),
  brightness: Brightness.dark,
  textTheme: const TextTheme(
    bodyText1: TextStyle(fontSize: 18),
    bodyText2: TextStyle(fontSize: 16),
    button: TextStyle(
      letterSpacing: 1.5,
      fontWeight: FontWeight.bold,
    ),
    headline1: TextStyle(
      fontWeight: FontWeight.bold,
    ),
    subtitle1: TextStyle(
      color: Colors.grey,
    ),
  ),
  buttonTheme: const ButtonThemeData(),
);

Apply it to the MaterialApp in the main.dart file

file_type_dartlang main.dart
import 'package:quizapp/theme.dart';

// ...

  return MaterialApp(
    theme: appTheme,
  );

Q&A Chat