# Nav bar color not shown on IOS device

**URL:** <https://forum.ionicframework.com/t/nav-bar-color-not-shown-on-ios-device/48253>\
**Category:** ionic-v1\
**Created:** [April 3, 2016, 3:47pm UTC](https://forum.ionicframework.com/t/nav-bar-color-not-shown-on-ios-device/48253 "2016-04-03T15:47:33Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![pmagnuson](https://avatars.discourse-cdn.com/v4/letter/p/7feea3/32.png) [@pmagnuson](https://forum.ionicframework.com/u/pmagnuson)\
**Post date:** [April 3, 2016, 3:47pm UTC](https://forum.ionicframework.com/t/nav-bar-color-not-shown-on-ios-device/48253/1 "2016-04-03T15:47:33Z")

</div>

My nav-bar color selection shows in browser and IOS emulator. It does not show on the real device.

```
<ion-view view-title="The" cache-view="false">
  <ion-nav-bar class="bar-energized">
  </ion-nav-bar>

  <ion-nav-buttons side="left">
    <button class="button button-icon button-clear ion-navicon" menu-toggle="left">
    </button>
  </ion-nav-buttons>

  <ion-nav-buttons side="right">
    <button class="button" ng-click="prevPage()" ng-disabled="pageNo<=0">Back</button>
    <button class="button" ng-click="nextPage()" ng-disabled="pageNo>=maxPages">Next</button>
  </ion-nav-buttons>
  
  <ion-content>
    <div ng-include="pageName">
    </div>
  </ion-content>
</ion-view>
```

---

<div class="post-metadata">

**Author:** ![pmagnuson](https://avatars.discourse-cdn.com/v4/letter/p/7feea3/32.png) [@pmagnuson](https://forum.ionicframework.com/u/pmagnuson)\
**Post date:** [April 3, 2016, 3:57pm UTC](https://forum.ionicframework.com/t/nav-bar-color-not-shown-on-ios-device/48253/2 "2016-04-03T15:57:25Z")

</div>

solved with the following:

```
<ion-view view-title="The Four Noble Truths" cache-view="false">
<ion-header-bar class="bar-energized">
  <ion-nav-bar class="bar-energized">
  <ion-nav-buttons side="left">
    <button class="button button-icon button-clear ion-navicon" menu-toggle="left">
    </button>
  </ion-nav-buttons>

  <ion-nav-buttons side="right">
    <button class="button" ng-click="prevPage()" ng-disabled="pageNo<=0">Back</button>
    <button class="button" ng-click="nextPage()" ng-disabled="pageNo>=maxPages">Next</button>
  </ion-nav-buttons>
  </ion-nav-bar>
  </ion-header-bar>
  
  <ion-content>
    <div ng-include="pageName">
    </div>
  </ion-content>
</ion-view>
```