Coder Social home page Coder Social logo

flutter_color_utils's Introduction

Color Utils: Play with Colors in Flutter!

Color Utils is a powerful Flutter package that empowers you to explore and manipulate colors with ease. This readme describes the features, usage, and provides helpful examples to get you started.

Key Features

  • Mix multiple colors: Create unique shades by combining colors.
  • Match color percentages: Compare colors and quantify their similarity.
  • Generate colors from hex strings: Easily convert hex codes to vibrant colors.
  • Color cooker: Discover color palettes that complement or contrast with a target color.

example website

https://trycolors.com

Getting Started

  1. Install dependencies
color_utils:
    git:
      url: https://github.com/shawon1fb/flutter_color_utils.git

or

dependencies:
  flutter_color_utils: ^0.0.1
  1. Import the library:
    import 'package:color_utils/flutter_color_utils.dart';

Explore Color Mixing

//colors
Color red = const Color(0xFF890041);
Color yellow = const Color(0xffFFCE51);
Color blue = const Color(0xff00224C);

// Choose your spicy palette
List spicyMixerList = [yellow, red, blue];

// Mix them up!
Color mix = ColorUtils.mixColors(spicyMixerList);

// expected color
Color spicyMixColor = const Color(0xff83504A);

// Check if the mixing worked as expected
print(spicyMixColor == mix ); // Should be true!

Convert Hex Strings to Colors

Color red = const Color(0xFF890041);
Color redHexColor = HexColor('#890041');

// They should be the same!
print(red == redHexColor);//true
print(redHexColor == red);//true

Match Color Similarity

Color spicyMixColor = const Color(0xff83504A);
Color pelorousColor = const Color(0xff44AABB);

// How similar are they? (0=not, 100=exact)
double match = spicyMixColor.match(pelorousColor);

double expected = 64.31;
print(((match - expected) < 0.02));//true

Discover Color Palettes

Color spicyMixColor = const Color(0xff83504A);
List<Color> baseColorList = [
   const Color(0xFF890041),
   const Color(0xffFFCE51),
   const Color(0xff00224C),
   const Color(0xffFFFFFF),
   const Color(0xff21211A),
    ];

// Find the best palette for spicyMix
ColorRecipe colorReversed = ColorRecipe(
    baseColorsList: baseColorList,
    targetColor: spicyMixColor
);
colorReversed.getColorRecipe(<Color>[]);

// Get the best matching colors
print(colorReversed.bestList);

// Check if the global match is perfect
print(colorReversed.globalMaxMatch == 100.0); // Should be true!

Additional Resources

Support

If you enjoy using Color Utils, consider buying me a coffee!

Buy Me A Coffee

flutter_color_utils's People

Contributors

shawon1fb avatar

Watchers

 avatar

flutter_color_utils's Issues

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.