Foundations
Colors
The MacroMath brand palette and the macronutrient colors.
App · Flutter · macromath_mobile
MacroMath uses a minimalist black-and-white theme with strategic orange, plus
one color per macronutrient. Every color lives in AppColors.
Brand
accent
#FF5833
accentLight
#FF8E53
accentDark
#FF4500
| Token | Hex | |
|---|---|---|
accent | #FF5833 | accent |
accentLight | #FF8E53 | |
accentDark | #FF4500 |
Macronutrients
calories
#FF5833
protein
#EF5350
carbs
#FFD600
fat
#66BB6A
| Macro | Token | Hex | |
|---|---|---|---|
| Calories | calories | #FF5833 | Calories |
| Protein | protein | #EF5350 | Protein |
| Carbs | carbs | #FFD600 | Carbs |
| Fat | fat | #66BB6A | Fat |
Use in Flutter
import 'package:macromath_mobile/core/constants/app_colors.dart';
Container(color: AppColors.accent);
Text('Protein', style: TextStyle(color: AppColors.protein));
// Main gradient (buttons)
Container(
decoration: const BoxDecoration(gradient: AppColors.primaryGradient),
);See the palette live in the Widgetbook → Foundations › Colors › Brand palette.