sketch icon indicating copy to clipboard operation
sketch copied to clipboard

add color functions

Open brunoti opened this issue 10 months ago • 4 comments

I'm thinking of:

import sketch/color

// Something like this with contructors
type Color {
  Named(String)
  Hex(String)
  Rgb(Int, Int, Int)
  Rgba(Int, Int, Int, Float)
  Hsl(Int, Float, Float)
}

sketch.class([
  sketch.background(
  	color.named("red")
		|> color.alpha(0.5)
		|> color.darken(0.2)
		|> color.to_hsl_string()
	)
])

sketch.class([
  sketch.background(
  	color.rgba(r: 255, g: 255, b: 255, alpha: 0.1)
		|> color.alpha(0.5)
		|> color.to_rgba_string() // rgba(255, 255, 255, 0.5)
	)
])

sketch.class([
  sketch.background(
  	color.rgba(r: 255, g: 0, b: 0, alpha: 1)
		|> color.to_hex_string() // "#FF0000
	)
])

	color.hex("FFF")
		|> color.alpha(0.5)
		|> color.to_hex_string() |> // rgba(255, 255, 255, 0.5)
	)

But let's discuss the API

brunoti avatar Apr 08 '24 18:04 brunoti

That would be awesome!

I think a really generic Color type would be nice, with multiple constructors, and ways to generate colors at the end like you wrote.

pub opaque type Color {
  Color(
    red: Int, 
    green: Int, 
    blue : Int,
    alpha: Int,
    luminance: Int
  )
}

pub fn hex(hex: String) -> Result(Color, Error) {
  parse_hex(hex)
}

pub fn rgba(r, g, b, a) -> Result(Color, Error) {
  parse_rgba(r, g, b, a)
}

ghivert avatar Apr 08 '24 21:04 ghivert

I wonder whether is should resides in sketch or not in the end. Maybe managing colors would just be something generic, and can be build easily on its own, before turning them into strings. I'm 100% sure that I want to build something like that in the long run, just not sure where. I don't want to add too much overhead on top of sketch, and I'd like to keep the abstractions really simple. I think it what could make the strength of sketch, because you don't have to relearn a new API. However, it could be really nice to have helpers to darken colors, etc.

I see two directions:

  • build it in sketch, and voilà, people how want to only use colors import sketch, and deal with it
  • build it in a proper package (like, I don't know, lumiere), and make sketch dependent of it. That way, people who just want to use the package can

I really much prefer option 2. The real strong upside is see to the first option though is to avoid people to install 2 different packages in gleam.toml.

ghivert avatar Apr 12 '24 09:04 ghivert

started here! give me your thoughts, open issues if you think it's worth and let's do it!

https://github.com/brunoti/lumiere

pure gleam!

brunoti avatar Apr 16 '24 20:04 brunoti

That seems really great ! 💜

It seems to be a great foundation to start with, the goal is probably now to test it properly, and add the desired features (darken etc.). I'll take a look and open issues 🙂

ghivert avatar Apr 17 '24 11:04 ghivert