Flutter Color Converter
Copying a CSS color directly into a Flutter integer literal can put the alpha byte in the wrong place. This converter places opacity first, then the red, green and blue channels expected by Flutter. Start with a CSS HEX or RGB value and choose alpha, or paste an existing Color literal to inspect its channels. The result includes both Color and const Color forms. When reading an existing literal, its embedded alpha takes priority over the separate input so the original opacity is preserved.
Your workspace
Runs locally in your browserResult
Your input is processed locally in your browser unless explicitly stated otherwise. Inputs are not saved by this tool.
How to use this tool
Enter #RRGGBB, rgb(r, g, b), or Color(0xAARRGGBB). For HEX or RGB, select alpha from 0 to 255.
Example
Input
#2196F3, alpha 255Output
Color(0xFF2196F3)
const Color(0xFF2196F3)What does this tool do?
Flutter Color integer literals use AARRGGBB order. The first byte controls opacity, followed by red, green and blue. FF means fully opaque; 00 means fully transparent.
Common mistakes and limitations
CSS eight-digit HEX is RRGGBBAA, while Flutter uses AARRGGBB. This tool accepts six- or three-digit CSS HEX and explicit Flutter literals to avoid that ambiguity.
Frequently asked questions
What does 80 mean for alpha?
Hex 80 is decimal 128, approximately 50.2% opacity. Alpha is a byte and therefore has 256 possible values.
Related tools
Color Converter
Convert HEX, RGB and HSL colors with a live preview.
Open tool Flutter & Dart ToolsJSON to Dart Converter
Generate null-safe Dart models from a JSON object.
Open tool Flutter & Dart ToolsDart / Flutter Package Name Generator
Turn project names into valid Dart package names.
Open tool