Класс Colors

Класс Colors даёт готовые константы для фона, текста и акцентов. Их передают в color у Material, в ThemeData и в TextStyle. Большинство имён - это MaterialColor с оттенками через shade500.

Синтаксис

Colors.blue

Значения

Значение	Описание
`red`	Красный оттенок `Material` палитры.
`pink`	Розовый оттенок.
`purple`	Фиолетовый оттенок.
`deepPurple`	Тёмно-фиолетовый оттенок.
`indigo`	Индиго.
`blue`	Синий оттенок.
`lightBlue`	Светло-синий оттенок.
`cyan`	Бирюзовый оттенок.
`teal`	Teal оттенок.
`green`	Зелёный оттенок.
`lightGreen`	Светло-зелёный оттенок.
`lime`	Лаймовый оттенок.
`yellow`	Жёлтый оттенок.
`amber`	Янтарный оттенок.
`orange`	Оранжевый оттенок.
`deepOrange`	Тёмно-оранжевый оттенок.
`brown`	Коричневый оттенок.
`grey`	Серый оттенок.
`blueGrey`	Серо-синий оттенок.
`black`	Чёрный цвет.
`white`	Белый цвет.
`transparent`	Полностью прозрачный цвет.

Поля вроде Colors.red имеют тип MaterialColor: у них есть оттенки shade500 и соседние shade700. Для однотонного цвета берут само имя, для акцента часто .shade500.

Пример

Давайте зальём фон цветом Colors.blue:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: Container(color: Colors.blue, child: Center(child: Text('abcde'))),
			),
		),
	);
}

На экране синий фон и белый текст по центру.

Пример

Давайте возьмём оттенок Colors.red.shade500:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: Container(color: Colors.red.shade500, child: Center(child: Text('12345'))),
			),
		),
	);
}

На экране фон среднего красного оттенка палитры Material.

Смотрите также

виджет Material,
которому передают color из Colors
виджет AppBar,
который берёт цвета из Theme и Colors
виджет ElevatedButton,
который использует цвета темы Material
виджет FloatingActionButton,
который часто красят через themeColor