Цвета Colors и Color в Flutter

Цвет в Flutter - объект Color. Готовую палитру Material даёт класс Colors: Colors.teal, Colors.red и другие именованные оттенки.

У многих цветов есть светлые и тёмные варианты: Colors.teal.shade200, Colors.teal.shade700. Один и тот же Color идёт и в заливку, и в текст. Точный корпоративный оттенок задают литералом Color(0xFF112233) - восемь шестнадцатеричных цифр с альфой в начале:

import 'package:flutter/material.dart';

void main() {
	runApp(const MaterialApp(home: ColorsDemoPage()));
}

class ColorsDemoPage extends StatelessWidget {
	const ColorsDemoPage({super.key});

	static const brand = Color(0xFF112233); // reused across rebuilds

	@override
	Widget build(BuildContext context) {
		return Scaffold(
			appBar: AppBar(
				title: const Text('Colors'),
				backgroundColor: Colors.teal,
			),
			body: Center(
				child: Column(
					mainAxisSize: MainAxisSize.min,
					children: [
						Container(
							padding: const EdgeInsets.all(16),
							color: Colors.teal.shade200,
							child: const Text('Light background'),
						),
						const SizedBox(height: 12),
						Text(
							'Brand',
							style: TextStyle(color: brand, fontSize: 22),
						),
					],
				),
			),
		);
	}
}

Сделайте Row из трёх квадратов:

Row(
	children: [
		Container(width: 80, height: 80, color: Colors.orange),
		Container(width: 80, height: 80, color: Colors.orange.shade100),
		Container(width: 80, height: 80, color: Color(0xFFFF5722)),
	],
)