[Xperia Arc Themes and Apps] BDFreak:
After I have posted my tutorial How To Add Extra Buttons In Navigation Bar,

Many user PM'ed me how to colorize navigation bar buttons.

So, here I will teach you how to colorize navigation bar buttons.

Maybe this is the last tutorial of 2013 from me.

Decompile SystemUI.apk

Navigate to SystemUI.apk\

Open apktool.yml file in file editor

Mine is look like this

version: 2.0.0-Beta7
apkFileName: 1-SystemUI.apk
isFrameworkApk: false
usesFramework:
ids:
- 1
sdkInfo:
minSdkVersion: '15'
targetSdkVersion: '15'
packageInfo:
cur_package: com.android.systemui
cur_package_id: '127'
orig_package: com.android.systemui
versionInfo:
versionCode: '15'
versionName: 4.0.4-tL1_3w
compressionType: false

[*]Add the red line only

version: 2.0.0-Beta7
apkFileName: 1-SystemUI.apk
isFrameworkApk: false
usesFramework:
ids:
- 1
[COLOR="Red"]- 2[/COLOR]
sdkInfo:
minSdkVersion: '15'
targetSdkVersion: '15'
packageInfo:
cur_package: com.android.systemui
cur_package_id: '127'
orig_package: com.android.systemui
versionInfo:
versionCode: '15'
versionName: 4.0.4-tL1_3w
compressionType: false

[*]Save the file

[*]Navigate to SystemUI.apk\res\drawable-hdpi

[*]Mark all the navigation buttons png and move them to a known directory

[*]In my case the files are

ic_sysbar_back.png
ic_sysbar_back_land.png
ic_sysbar_home.png
ic_sysbar_home_land.png
ic_sysbar_recent.png
ic_sysbar_recent_land.png

[*]Now rename all the files and add "_colored" at the end without quote

[*]The files will be look like

ic_sysbar_back[COLOR="Green"]_colored[/COLOR].png
ic_sysbar_back_land[COLOR="Green"]_colored[/COLOR].png
ic_sysbar_home[COLOR="Green"]_colored[/COLOR].png
ic_sysbar_home_land[COLOR="Green"]_colored[/COLOR].png
ic_sysbar_recent[COLOR="Green"]_colored[/COLOR].png
ic_sysbar_recent_land[COLOR="Green"]_colored[/COLOR].png

[*]Now have to make 6 xml files like bellow

File Name: ic_sysbar_back.xml

<?xml version="1.0" encoding="utf-8"?>
<somc:colorizable android:drawable="@drawable/ic_sysbar_back_colored" android:color="@com.sonyericsson.uxp:color/semc_theme_accent_color" xmlns:somc="com.sonymobile"
xmlns:android="http://schemas.android.com/apk/res/android" />

File Name: ic_sysbar_back_land.xml

<?xml version="1.0" encoding="utf-8"?>
<somc:colorizable android:drawable="@drawable/ic_sysbar_back_land_colored" android:color="@com.sonyericsson.uxp:color/semc_theme_accent_color" xmlns:somc="com.sonymobile"
xmlns:android="http://schemas.android.com/apk/res/android" />

File Name: ic_sysbar_home.xml

<?xml version="1.0" encoding="utf-8"?>
<somc:colorizable android:drawable="@drawable/ic_sysbar_home_colored" android:color="@com.sonyericsson.uxp:color/semc_theme_accent_color" xmlns:somc="com.sonymobile"
xmlns:android="http://schemas.android.com/apk/res/android" />

File Name: ic_sysbar_home_land.xml

<?xml version="1.0" encoding="utf-8"?>
<somc:colorizable android:drawable="@drawable/ic_sysbar_home_land_colored" android:color="@com.sonyericsson.uxp:color/semc_theme_accent_color" xmlns:somc="com.sonymobile"
xmlns:android="http://schemas.android.com/apk/res/android" />

File Name: ic_sysbar_recent.xml

<?xml version="1.0" encoding="utf-8"?>
<somc:colorizable android:drawable="@drawable/ic_sysbar_recent_colored" android:color="@com.sonyericsson.uxp:color/semc_theme_accent_color" xmlns:somc="com.sonymobile"
xmlns:android="http://schemas.android.com/apk/res/android" />

File Name: ic_sysbar_recent_land.xml

<?xml version="1.0" encoding="utf-8"?>
<somc:colorizable android:drawable="@drawable/ic_sysbar_recent_land_colored" android:color="@com.sonyericsson.uxp:color/semc_theme_accent_color" xmlns:somc="com.sonymobile"
xmlns:android="http://schemas.android.com/apk/res/android" />

[*]Now place all the xml files to SystemUI.apk\res\drawable folder

[*]Recompile your SystemUI.apk

Please Note :

Take backup before doing anything.

Use Notepad++ to edit files.

Please read the tutorial properly befor editing files.

This tutorial will work for other devices too.