flutter_brand_palettes

Last updated:

0 purchases

flutter_brand_palettes Image
flutter_brand_palettes Images
Add to Cart

Description:

flutter brand palettes

flutter_brand_palettes #











Contents #

Overview
Getting Started
Color Palettes in action
Color Gradient in action
Color Gradients
Demo application
I need the 'X' color palettes
Contribute
List of Color Palettes
References

Overview #
Flutter Brand Palettes is a collection of declarative, object-oriented
classes for the color palettes of popular brands and companies.
For example, to retrieve the Instagram colors at once, as a List<Color>
object, simply declare InstagramGrad().colors — the 'Grad' suffix is short for
Gradient.
For a single color, simply select it from the color palette class it belongs to.
For example, the command Instagram.royalBlue() retrieves the royal blue color
from the Instagram color palette; likewise, Instagram.yellow() retrieves the
yellow color; and so on.
In addition, all classes are well-documented and fully unit-tested, passing
through a CI pipeline with rigorous quality ports.
Getting Started #
Instead of a constant integer value, a 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 example, the command Facebook.blue().color returns Facebook's blue color
#4267B2. Similarly, the command Instagram.red().color returns Instagram's
red color #FD1D1D; Google.red().color, Google's red color #DB4437.
Therefore, the command pattern for any brand is: 'Brand.colorName().color'.
Color Palettes in Action #
The code bellow builds a container widget whose background color is Facebook
blue.
import 'package:brand_colors/flutter_brand_colors.dart';
import 'package:flutter/material.dart';

class FacebookIsh extends StatelessWidget {

const _blue = Facebook.blue();

@override
Widget build(BuildContext context) => Container(color: _blue.color);
}
copied to clipboard
Color Gradient in Action #
The code below builds a rectangle filled with the Google logo gradient.

/// Rectangle filled with Google logo color gradient.
class Googleish extends StatelessWidget {

static final _googleGrad = const GoogleGrad().colors;

@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(
gradient: LinearGradient(colors: _googleGrad),
),
);
}
}

copied to clipboard
The result of the previous code in full screen

Demo application #
The demo application provides a fully working example, focused on demonstrating
exactly one brand in action: Instagram. You can take the code in this demo and
experiment with it.
To run the demo application:
git clone https://github.com/dartoos-dev/flutter_brand_palettes.git
cd flutter_brand_palettes/example/
flutter run -d chrome

copied to clipboard
This should launch the demo application on Chrome in debug mode.

I need the 'X' color palette #
Do you need a color palette that has not been implemented yet?
It doesn't matter the size and relevance of the company, not even if it's a tech
company.
Just open an
issue and enter
the brand or company name; the color palette will be implemented as soon as
possible.
Contribute #
Contributors are welcome!

Open an issue regarding an improvement, a bug you noticed, or ask to be
assigned to an existing one.
If the issue is confirmed, fork the repository, do the changes on a separate
branch and make a Pull Request.
After review and acceptance, the Pull Request is merged and closed.

Make sure the command below passes before making a Pull Request.
flutter analyze && flutter test
copied to clipboard
List of Color Palettes (A-Z) #
For more in-depth details — hex codes, brand colors, etc. —, check the
color-palettes
API documentation.

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.


Ibm

black, blue, white.


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.


Oracle

black, grey, red, white.


PayPal

black, pal blue, pay blue, white.


Pinterest

red, 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.


Uber

primary

black, white.


safety

blue.


secondary

brown, green, orange, purple, red, yellow.




Visa

blue, gold.


Whatsapp

blue, light green, teal green, teal green dark, white, white chocolate.


Youtube

almost black, red, white.



Hex color values references #

us brand colors
brand palettes
brand colors

License:

For personal and professional use. You cannot resell or redistribute these repositories in their original state.

Files In This Product:

Customer Reviews

There are no reviews.