jfairbank / chroma Goto Github PK
View Code? Open in Web Editor NEWRuby gem for color manipulation and palette generation
License: ISC License
Ruby gem for color manipulation and palette generation
License: ISC License
I know chroma has a to_rgb
method, but it's actually a port of tinyColor's toRgbString
.
I am interested in adding a method to this lib which will output a hash eg., {r: 255, g: 255, b: 255}
.
This can be very useful to do some arithmetic on the r
, g
and b
values individually.
Is this something that makes sense to be added to this lib?
At minimum need to support the :as
option.
Chroma.define_palette :dynamic_palette do |opts|
spin opts[:angle] || 90
end
'red'.paint.foo(angle: 60, as: :rgb)
irb(main):007:0> 'rgba(255, 0, 0, 0.5)'.paint
=> #ff0000
Support syntax for defining custom palettes.
Something like:
Chroma.define_palette(:my_palette) do
spin 60
spin 180
brighten 10
end
'red'.paint.palette.my_palette #=> ['#ff0000', '#ffff00', '#00ffff', '#ff1919']
I just came across this gem in an attempt to autogenerate some colors for chart.js. It's very cool and working quite well so far. Thank you for all the hard work!
The only problem I'm having is the sort order for a generated palette, specifically the first / last color in the array. It's possible that I'm missing some config option or something, but, lemme break it down for you
I'm using this code to create my monochromatic palette:
"#ff6384".paint.palette.monochromatic(size: 16, as: :hex)
Which is generating this array (I've truncated it for brevity):
["#ff6384", "#100608", "#200c11", "#301319", "#401921", "#501f29", "#602532" ... ]
Which produces this color palette in my chart:
As you can see, it looks like the first color needs to go to the end or the rest of the array (except for the first one) needs to be reversed.
I even checked your examples in the README, and I'm seeing the same problem:
'red'.paint.palette.monochromatic(as: :hex)
#=> ['#ff0000', '#2a0000', '#550000', '#800000', '#aa0000', '#d40000']
That goes from red to (basically) black and then works its way back toward red.
Is there a way to specify "direction" in a palette? Like, to be able to pass in an argument to the palette to start with my seed color or end with my seed color.
Thoughts on this? Am I missing something?
Need to pass a nil
format to all possible classes.
'red'.paint.to_hsl_s #=> hsl(0, 100%, 50%)
Chroma::Color.new('red'.paint.to_hsl) #=> hsl(0, 1%, 1%)
irb(main):010:0> 'red'.paint.palette.triad
=> [hsl(0, 100%, 50%), hsl(120, 100%, 50%), hsl(240, 100%, 50%)]
❌ ❌ ❌
If I generate a custom palette, say "user_palette", then later, I want to regenerate it, I get:
Chroma::Errors::PaletteDefinedError (Palette `user_palette' already exists):
Is there a way to support regenerating an already existing palette?
On one hand it's easy to add alpha values to Strings manually. On the other hand, Chroma supports alpha values already, so adding a way to change opacity feels natural in some sense. Having done it manually, I don't think it looks pretty, and it would be nice if the gem could do it.
If there is support for the idea, it might be helpful to sketch the interface a bit, to start in the right direction. 🎨
If opacity/transparency concepts yielded easy, naturally paired verbs, such as "darken"/"lighten", it might make sense to model after that. As I can't find such a pair, I would suggest .opacity(20)
which would the opacity to a percentage. Hence it would be a bit similar to .grayscale
, but with a parameter.
How does this sound? Any considerations?
I can do it, but would be nice to get go ahead before contributing. 🙏
Here's a beginning list to add on to:
Chroma.paint
Chroma.hex_from_name
and Chroma.name_from_hex
brighten
, darken
, etc.)Duck typing and all that stuff.
Alpha is the highest order byte, but FromHexStringValues.from_hex8
treats its second parameter as the red byte.
Use the different supported formats as option values.
'red'.paint.palette.triad(as: :hex) #=> ['#ff0000', '#00ff00', '#0000ff']
'red'.paint == 'red'.paint #=> false, should be true
For example:
"hsv(100, 75%, 50%)".paint.to_hex # got: "#408020" expected: "#3F7F1F"
In fact #3F7F1F
is hsv(100, 75%, 50.2%)
. Rounding error.
For example, to_rgb
shouldn't return the actual ColorModes::Rgb
instance. It should return a new Color
with a format of :rgb
(or the same instance if the format is already :rgb
).
This will require the current implementations to be private helpers for assisting the string serializers (i.e. to_rgb_s
).
irb(main):003:0> 'yellow'.paint.send(:rgb)
=> #<Chroma::ColorModes::Rgb:0x007fa088e1f1d8 @r=255, @g=255, @b=0, @a=1.0>
irb(main):004:0> 'red'.paint.spin(60).send(:rgb)
=> #<Chroma::ColorModes::Rgb:0x007fa088e25330 @r=254.99999999999994, @g=255.0, @b=0, @a=1>
irb(main):005:0> 'yellow'.paint == 'red'.paint.spin(60)
=> false
According to this https://www.atlantbh.com/how_to_detect_colour_brightness_in_ruby/ brightness should be calculated as
sqre(red^2 * 0.299 + green^2 * 0.587 + blue^2 * 0.114)
rather than
red * 0.299 + green * 0.587 + blue * 0.114
Why does this gem use a different formula?
Need to test more colors in public API. Also, need to test internal classes and some private APIs.
Hi,
This is my favorite color manipulation gem, but I see its development was halted some years ago.
It it still maintained? Will you accept pull requests?
It would be nice, for those of us who are hex-impaired, to be able to see it in a browser somehow. Maybe just export to HTML string for starters?
This applies to inspect
and to_s
. It should still return <unknown>
when calling to_name
.
irb(main):002:0> 'red'.paint.brighten
=> <unknown>
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.