Flutter Brand Palettes

pub license style: lint Build Status Coverage Status Hits-of-Code EO principles respected here

Stop searching the internet for brand colors hex codes! Stop wondering whether an obscure command like Grey.colors[200](why 200 and not, say, 130 or 440?!) represents a light, medium or dark shade of grey. (actually it means Grey.light(), in declarative programming).

This a fully tested (100% coverage), declarative and object-oriented package for the official color palettes of popular brands and companies and of the Material Design standard.

Getting Started

Instead of a constant integer value, each color is represented by a named constructor of its corresponding brand class. In this way, the source code becomes more object-oriented, readable and maintainable. For instance, Instagram.red().color retrieves the Instagram's red color #FD1D1D; Google.red().color, Google's red #DB4437; Facebook.blue().color, Facebook's blue #4267B2; and so on.

Material Design color classes

These are classes whose names are the colors they represent, like "Grey". E.g: Grey() represents the primary grey color, equivalent to the Flutter's cryptic Colors.grey.shade500; Grey.light()Colors.grey.shade200; Grey.veryDark()Colors.grey.shade900; and so on.

For more details: api reference.

Usage example

import 'package:brand_colors/flutter_brand_colors.dart';
import 'package:flutter/material.dart';

class FacebookIsh extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Container(
      color: Facebook.blue().color,
    );
  }
}

Do you need any brand that has not yet been implemented?

Just open an issue, enter the brand name and a reference link for the (hexadecimal) values of the colors. The brand colors will be implemented as soon as possible.

Material Design Color Classes

  • Red, RedAccent, Pink, PinkAccent, Purple, PurpleAccent, DeepPurple, DeepPurpleAccent.
  • Blue, BlueAccent, LightBlue, LightBlueAccent, Cyan, CyanAccent, Indigo, IndigoAccent.
  • Green, GreenAccent, LightGreen, LightGreenAccent, Lime, LimeAccent, Teal,TealAccent.
  • Yellow, YellowAccent, Amber, AmberAccent, Orange, OrangeAccent, DeepOrange, Brown.
  • Grey, BlueGrey.
  • Black, Black.opacity87, Black.opacity54, Black.opacity45, Black.opacity38, Black.opacity26, Black.opacity12.
  • White, White.opacity70, White.opacity60, White.opacity54, White.opacity38, White.opacity30, White.opacity24, White.opacity12, White.opacity10.
  • Transparent.

Color Swatches

  • Primaries.

See also: material design's color palette.

Brand Palettes Classes (A-Z)

  • Amazon
    • black, orange.
  • American Express
    • bright blue, deep blue, neutral 1 (light grey), neutral 2 (dark grey).
  • Android
    • green.
  • Apple
    • black, silver, white.
  • Bitcoin
    • grey, orange, white.
  • Facebook
    • black, blue, grey, white.
  • FedEx
    • orange, purple.
    • Old Palette
      • black, blue, green, grey, red, yellow, white.
  • Flutter
    • blue, dark blue, dark grey, light blue, light grey, grey, white.
  • Google
    • blue, green, red, yellow.
  • Instagram
    • blue, dark orange, dark pink, light yellow, orange, purple, purple-red, red, royal blue, yellow.
  • Iphone11
    • black, light green, light purple, light yellow, red, white.
  • Iphone11Pro
    • midnight green, rose-gold, silver, space grey.
  • Iphone7
    • black, gold, rose-gold, silver.
  • Iphone8
    • gold, silver, space grey.
  • IphoneXR2
    • black, blue, coral, red, white, yellow.
  • IphoneXS
    • black, gold, silver.
  • Kotlin
    • blue, orange, purple, violet.
  • Linkedin
    • blue, white.
  • Mastercard
    • black, orange, red, yellow.
  • Messenger
    • primaries
      • black, blue, cool white, coral, pink, purple.
    • neutrals (cool grey tones)
      • daylight, midnight, twilight.
  • Microsoft
    • blue, green, grey, orange-red, yellow.
  • Netflix
    • black, red, white.
  • PayPal
    • black, pal blue, pay blue, white.
  • Reddit
    • black, orange, white.
  • Slack
    • aubergine (eggplant), black, blue, green, red, yellow.
  • Spotify
    • black, green, white.
  • Swift
    • black, sunset orange.
  • TikTok
    • black, red, turqoise, white.
  • Tinder
    • grey, pink.
  • Twitter
    • black, blue, dark grey, extra extra light grey, extra light grey, light, grey, white.
  • Visa
    • blue, gold.
  • Whatsapp
    • blue, light green, teal green, teal green dark, white, white chocolate.
  • Youtube
    • almost black, red, white.

Hex color values references

Libraries

brands
colors
flutter_brand_palettes
swatches