Menu
CoddyTech

Colors in Hex

Part of the Your First App section of Coddy's Flutter journey. Lesson 10 of 32.

Designers often give colors as a hex code, like #6A1B9A: two digits for red, two for green, two for blue. In Flutter you write it as a Color:

Color(0xFF6A1B9A)

0x tells Dart a hex number follows. Then come two more digits before the color: FF means fully visible. 00 there would make the color completely see-through, so the text would vanish. After that come the six digits of the hex code.

challenge icon

Challenge

Easy

Our designer wants Coddy in the purple #6A1B9A, fully visible. Set the text's color: to that Color.

Try it yourself

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: Text('Coddy', style: TextStyle(fontSize: 48, color: Colors.black)),
        ),
      ),
    );
  }
}
quiz iconTest yourself

This lesson includes a short quiz. Start the lesson to answer it and track your progress.

All lessons in Your First App

Practice on your own: Online Flutter compiler