# Ionic 2 buttons not mapping color variables

**URL:** <https://forum.ionicframework.com/t/ionic-2-buttons-not-mapping-color-variables/39673>\
**Category:** ionic-v3\
**Created:** [December 21, 2015, 5:34pm UTC](https://forum.ionicframework.com/t/ionic-2-buttons-not-mapping-color-variables/39673 "2015-12-21T17:34:42Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![luchillo17](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/luchillo17/32/78209_2.png) [@luchillo17](https://forum.ionicframework.com/u/luchillo17)\
**Post date:** [December 21, 2015, 5:34pm UTC](https://forum.ionicframework.com/t/ionic-2-buttons-not-mapping-color-variables/39673/1 "2015-12-21T17:34:42Z")

</div>

Hi, i’m trying to use a custom color for an `ion-item` but putting the attribute doesn’t change the style of the item, tried changing to a button but nothing, then tried changing to an already provided color like `danger` but nothing.

At this point i will have to mess with ionic-framework code to see where’s the issue, currently using ionic alpha.42 that needs this kind of mapping, the color works say for the navbar but not for buttons:

> ```
> $colors: (
> 
> ```

```
  primary: #009688,
  primaryDisabled: #00665C,
  secondary: #387ef5,
  danger: #f53d3d,
  light: #f4f4f4,
  dark: #222,
  favorite: #69BB7B
);

```

> ```
> $colors-md: (
> 
> ```

```
  primary: map-get($colors, primary),
  primaryDisabled: map-get($colors, primaryDisabled),
  secondary: map-get($colors, secondary),
  danger: map-get($colors, danger),
  light: map-get($colors, light),
  dark: map-get($colors, dark),
  favorite: map-get($colors, favorite)
);

```

> ```
> $colors-ios: (
> primary: map-get($colors, primary),
> primaryDisabled: map-get($colors, primaryDisabled),
> secondary: map-get($colors, secondary),
> danger: map-get($colors, danger),
> light: map-get($colors, light),
> dark: map-get($colors, dark),
> favorite: map-get($colors, favorite)
> );
> 
> ```

---

<div class="post-metadata">

**Author:** ![willb](https://avatars.discourse-cdn.com/v4/letter/w/6de8d8/32.png) [@willb](https://forum.ionicframework.com/u/willb)\
**Post date:** [December 22, 2015, 11:01am UTC](https://forum.ionicframework.com/t/ionic-2-buttons-not-mapping-color-variables/39673/2 "2015-12-22T11:01:01Z")

</div>

I have the same experience - it can be reproduced in the conference app by changing the primary color.

---

<div class="post-metadata">

**Author:** ![luchillo17](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/luchillo17/32/78209_2.png) [@luchillo17](https://forum.ionicframework.com/u/luchillo17)\
**Post date:** [December 22, 2015, 1:54pm UTC](https://forum.ionicframework.com/t/ionic-2-buttons-not-mapping-color-variables/39673/3 "2015-12-22T13:54:21Z")

</div>

The thing is that i could override the color for primary to dark green, even the custom color works in normal buttons or in nav bars, the issue is when i try to use it in a button inside a `ion-list`, the button used the `ion-item` attribute directive instead of the component, that’s the particular case when none of the color directives (not even `primary`) works, it just stays white with black font color.