show color from text with flutter

Readme.md

just create new flutter project, and replace the main.dart.

try to paste in textfield :

   Turquoise Blue (#40E0D0)
   Coral Pink (#FF6F61)
   Sunny Yellow (#FFD700)
   Leaf Green (#8F9779)
   Creamsicle Orange (#FFA07A)

main.dart

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(
      title: 'Show pallete',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.black),
        useMaterial3: true,
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class ColorItem {
  final Color color;
  final String text;
  ColorItem({
    required this.color,
    required this.text,
  });
}

class _MyHomePageState extends State<MyHomePage> {
  String text = "";
  List<ColorItem> palletes = [];
  onChange(String text) {
    setState(() {
      this.text = text;
    });
  }

  generate() {
    final teks1 = text.split('\n');
    List<ColorItem> colors = [];
    for (var teks in teks1) {
      final index = teks.indexOf('#');
      if (index < 0) continue;
      final teksHex = teks.substring(index + 1, index + 7);
      colors.add(
        ColorItem(
          color: Color(int.parse(teksHex, radix: 16)).withOpacity(1),
          text: teks,
        ),
      );
    }
    setState(() {
      palletes = colors;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: const Text('Show color pallete'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          mainAxisSize: MainAxisSize.max,
          children: <Widget>[
            Expanded(
              child: Row(
                children: palletes
                    .map(
                      (e) => Flexible(
                        child: Container(
                          height: double.infinity,
                          width: double.infinity,
                          padding: const EdgeInsets.all(12),
                          color: e.color,
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.end,
                            children: [
                              Text(
                                e.text,
                                textAlign: TextAlign.center,
                              ),
                            ],
                          ),
                        ),
                      ),
                    )
                    .toList(),
              ),
            ),
            Row(
              children: [
                Expanded(
                  child: Padding(
                    padding: const EdgeInsets.all(24),
                    child: TextField(
                      onChanged: onChange,
                      maxLines: 10,
                      decoration:
                          const InputDecoration(border: OutlineInputBorder()),
                    ),
                  ),
                ),
                TextButton(
                  onPressed: generate,
                  child: const Text("Generate"),
                )
              ],
            ),
          ],
        ),
      ),
    );
  }
}