atom / one-light-ui

Atom One light UI theme
MIT License
73 stars 62 forks source link

Can I merely change the accent color (green) to something else? #31

Closed smlombardi closed 9 years ago

smlombardi commented 9 years ago

I'm not particularly fond of green. :smile:

Can I override it in my style sheet?

simurai commented 9 years ago

What's the syntax theme you're using? The accent color is based on the background of the syntax theme. If the background is pure white, the accent color defaults to a blueish #4777D7.

There isn't an easy way to change the accent variable, but you could try to override all places where the accent color is used. Something like:

@my-accent-color: red;

.tab-bar .tab::before,
.tree-view::before {
  background-color: @my-accent-color;
}
atom-text-editor[mini].is-focused {
  border-color: @my-accent-color;
  box-shadow: 0 0 0 1px @my-accent-color;
  background-color: lighten(@my-accent-color, 44%);
}
smlombardi commented 9 years ago

Thanks. I am currently using my Kuroir-Atom scheme. It has a grayish background. Maybe it's a greenish gray?

simurai commented 9 years ago

Yeah, Kuroir-Atom's background is hsl(120, 2%, 91%). It has very little saturation, only 2%. But it's still a tiny bit green.

To create the accent color, One light takes the hue (120) from the background and increases saturation and lower brightness.

hsl(120, 2%, 91%) -> hsl(120, 64%, 56%)