diff --git a/org.adempiere.ui.zk/theme/default/css/fragment/font-icons.css.dsp b/org.adempiere.ui.zk/theme/default/css/fragment/font-icons.css.dsp
index 9aeacfbea1..4f80dbdc6d 100644
--- a/org.adempiere.ui.zk/theme/default/css/fragment/font-icons.css.dsp
+++ b/org.adempiere.ui.zk/theme/default/css/fragment/font-icons.css.dsp
@@ -295,3 +295,6 @@
 .z-icon-GetMail:before {
 	content: "\f0e0";
 }
+.z-icon-Calendar:before {
+	content: "\f073";
+}
\ No newline at end of file
diff --git a/org.adempiere.ui.zk/theme/default/zul/calendar/calendar.css b/org.adempiere.ui.zk/theme/default/zul/calendar/calendar.css
index 99dd284023..1954391852 100644
--- a/org.adempiere.ui.zk/theme/default/zul/calendar/calendar.css
+++ b/org.adempiere.ui.zk/theme/default/zul/calendar/calendar.css
@@ -13,15 +13,15 @@
 	color: blue !important;
 }
 .tabs * {
-	background: #7EAAC6;
+	background: #ececec;
 	cursor: pointer;
 }
 .tabs .bd {
-	background: #7EAAC6;
+	background: #c5c5c5;
 	zoom: 1;
 }
 .tabs .t1, .tabs .t2, .tabs .t3 {
-	background: #7EAAC6;
+	background: #e4e4e4;
 	font-size: 0;
 	line-height: 0;
 	margin: 0 2px;
@@ -38,7 +38,7 @@
 	margin: 0 1px;
 }
 .tabs .b1, .tabs .b2, .tabs .b3 {
-	background: #7EAAC6;
+	background: #e4e4e4;
 	font-size: 0;
 	line-height: 0;
 	margin: 0 2px;
@@ -55,7 +55,7 @@
 	margin: 0 1px;
 }
 .tabs .cm {
-	background: #C3E0F2;
+	background: #c7c7c7;
 	margin: 0 1px;
 	border-left: 1px solid white;
 	border-right: 1px solid white;
@@ -66,7 +66,7 @@
 	vertical-align: middle;
 	text-align: center;
 	white-space: nowrap;
-	color: #0F3B82;
+	color: #000000;
 	padding: 2px 5px;
 }
 .tabs .text, .tabs .text * {
@@ -76,8 +76,7 @@
 	position: relative;
 }
 .top {
-	background: #f1fcff;
-	border-bottom: 0.2em solid #B5D5E9;
+	border-bottom: 0.2em solid #dedede;
 	overflow: hidden;
 	height: 0.7em;
 	position: absolute;
@@ -155,4 +154,65 @@
 }
 .purple {
 	background: #B373B3!important;
-}
\ No newline at end of file
+}
+.z-font-Calendar .text {
+	color: #333333;
+}
+.z-font-Calendar .cnt {
+	background: #ffffff;
+}
+.z-font-Calendar .bd {
+    background: #ffffff;
+}
+.z-font-Calendar .t1,.z-font-Calendar .t2,.z-font-Calendar .t3 {
+    background: #ffffff;
+}
+.z-font-Calendar .b1,.z-font-Calendar .b2,.z-font-Calendar .b3 {
+    background: #ffffff;
+}
+.z-cal-font-theme .z-calendars-inner {
+    background: #e4e4e4;
+}
+.z-cal-font-theme .z-calendars-body {
+    background: #e4e4e4;
+}
+.z-cal-font-theme .z-calendars-t1,
+.z-cal-font-theme .z-calendars-t2,
+.z-cal-font-theme .z-calendars-t3 {
+    background: #e4e4e4;
+}
+.z-cal-font-theme .z-calendars-b1,
+.z-cal-font-theme .z-calendars-b2,
+.z-cal-font-theme .z-calendars-b3 {
+    background: #e4e4e4;
+}
+.z-cal-font-theme .z-calendars-month-header {
+    background-color: #e4e4e4;
+}
+.z-cal-font-theme .z-calendars-month-date {
+    background-color: #e9e9e9;
+}
+.z-cal-font-theme .z-calendars-month-date-off {
+    background-color: #c5c5c5;
+}
+.z-calendars-week-cnt .z-calendars-timezone {
+	background-color: #cfcfcf;
+	border-right: 1px solid #a2a2a2;
+	color: #000000;
+}
+.z-calendars-timezone {
+	color: #000000;
+}
+.z-calendars-week-cnt {
+	background-color: #ececec;
+}
+.z-calendars-daylong-body {
+	background-color: #ececec;
+	border-color: #808080 white white #747474;
+}
+.z-calendars-hour-of-day,
+.z-calendars-day-of-week-inner,
+.z-calendars-day-of-week-inner .z-calendars-week-today,
+.z-calendars-month-header .z-calendars-day-of-week {
+	color: #000000 !important;
+}
diff --git a/org.adempiere.ui.zk/theme/default/zul/calendar/calendar.zul b/org.adempiere.ui.zk/theme/default/zul/calendar/calendar.zul
index 302542f44b..73a7ca96fc 100644
--- a/org.adempiere.ui.zk/theme/default/zul/calendar/calendar.zul
+++ b/org.adempiere.ui.zk/theme/default/zul/calendar/calendar.zul
@@ -6,6 +6,8 @@
 	import org.compiere.util.Msg;
 	import org.compiere.util.Env;
 	import org.compiere.util.Util;
+	import org.adempiere.webui.theme.ThemeManager;
+
 	var today = Msg.getMsg(Env.getCtx(),"Today");
 	var refresh = Util.cleanAmp(Msg.getMsg(Env.getCtx(),"Refresh"));
 	var switchTimeZone = Msg.getMsg(Env.getCtx(),"SwitchTimeZone");
@@ -16,17 +18,23 @@
 	var EventsAnalysis = Msg.getMsg(Env.getCtx(),"EventsAnalysis");
 	var FirstDayofWeek = Msg.getMsg(Env.getCtx(),"FirstDayofWeek");
 	var RequestType = Msg.getElement(Env.getCtx(),"RequestType");
-	
+
+	var isFontIcon = ThemeManager.isUseFontIconForImage();
+	var leftBtn = isFontIcon ?  "z-icon-PreviousRecord" : "arrow-left";
+	var rightBtn = isFontIcon ?  "z-icon-NextRecord" : "arrow-right";
+	var fontClass = isFontIcon ? "z-font-Calendar" : "";
+	var calendarClass = isFontIcon ? "z-cal-font-theme" : "";
+
 ]]></zscript>
 <style src="/theme/default/zul/calendar/calendar.css"/>
 <borderlayout id="main">
 <center border="none">
-<calendars firstDayOfWeek="Monday" mold="month" id="cal" xmlns:w="client" w:onBind="try{_overrideMsgCal(); var me=this; setTimeout(function(){me.onSize();},50); }catch(error){} ">
+<calendars class="${calendarClass}" firstDayOfWeek="Monday" mold="month" id="cal" xmlns:w="client" w:onBind="try{_overrideMsgCal(); var me=this; setTimeout(function(){me.onSize();},50); }catch(error){} ">
 	<toolbar sclass="calendar-toolbar">
 		<div class="float-left">
-			<hbox>
-				<divarrow id="divArrowLeft" type="arrow-left"/>
-				<divarrow id="divArrowRight" type="arrow-right"/>
+			<hbox sclass="cal-header-filter">
+				<divarrow id="divArrowLeft" type="${leftBtn}" fontClass="${fontClass}"/>
+				<divarrow id="divArrowRight" type="${rightBtn}" fontClass="${fontClass}"/>
 				<div>
 					<button id="btnCurrentDate" mold="os" label="${today}"/>
 					<button id="btnSwitchTimeZone" mold="os" label="${switchTimeZone}"/>
diff --git a/org.adempiere.ui.zk/theme/default/zul/calendar/calendar_mini.zul b/org.adempiere.ui.zk/theme/default/zul/calendar/calendar_mini.zul
index e747e4f244..641d3bcacf 100644
--- a/org.adempiere.ui.zk/theme/default/zul/calendar/calendar_mini.zul
+++ b/org.adempiere.ui.zk/theme/default/zul/calendar/calendar_mini.zul
@@ -6,22 +6,32 @@
 	import org.compiere.util.Msg;
 	import org.compiere.util.Env;
     import org.compiere.util.Util;
+    import org.adempiere.webui.theme.ThemeManager;
+
 	var today = Msg.getMsg(Env.getCtx(),"Today");
 	var refresh = Util.cleanAmp(Msg.getMsg(Env.getCtx(),"Refresh"));
+	var isFontIcon = ThemeManager.isUseFontIconForImage();
+	var leftBtn = isFontIcon ? "z-icon-PreviousRecord" : "arrow-left";
+	var rightBtn = isFontIcon ? "z-icon-NextRecord" : "arrow-right";
+	var fontClass = isFontIcon ? "z-font-Calendar" : "";
+	var calIconClass = isFontIcon ? "z-icon-Calendar" : "";
+	var calendarClass = isFontIcon ? "z-cal-font-theme" : "";
+	calendarIcon = isFontIcon ? "" : calendarIcon;
+	
 ]]></zscript>
 <style src="/theme/default/zul/calendar/calendar.css"/>
-<calendars firstDayOfWeek="Monday" mold="month" id="cal" xmlns:w="client" w:onBind="try{_overrideMsgCal(); var me=this; setTimeout(function(){me.onSize();},50); }catch(error){} ">
+<calendars sclass="${calendarClass}" firstDayOfWeek="Monday" mold="month" id="cal" xmlns:w="client" w:onBind="try{_overrideMsgCal(); var me=this; setTimeout(function(){me.onSize();},50); }catch(error){} ">
 	<toolbar sclass="calendar-toolbar">
 		<div class="float-left">
 			<hbox align="center">
-				<divarrow id="divArrowLeft" type="arrow-left"/>
-				<divarrow id="divArrowRight" type="arrow-right"/>
+				<divarrow id="divArrowLeft" type="${leftBtn}" fontClass="${fontClass}"/>
+				<divarrow id="divArrowRight" type="${rightBtn}" fontClass="${fontClass}"/>
 				<div>
 					<button id="btnCurrentDate" label="${today}" sclass="btn-small"/>
 				    <separator orient="vertical" spacing="2px"/>
 					<label id="lblDate"/>
 					<toolbarbutton id="btnRefresh" label="${refresh}" class="refresh"/>
-					<toolbarbutton id="btnCal" image="${calendarIcon}"/>
+					<toolbarbutton id="btnCal" image="${calendarIcon}" class="${calIconClass}"/>
 				</div>
 			</hbox>
 		</div>
diff --git a/org.adempiere.ui.zk/theme/default/zul/calendar/divarrow.zul b/org.adempiere.ui.zk/theme/default/zul/calendar/divarrow.zul
index fc3d8f5606..ea179b3146 100644
--- a/org.adempiere.ui.zk/theme/default/zul/calendar/divarrow.zul
+++ b/org.adempiere.ui.zk/theme/default/zul/calendar/divarrow.zul
@@ -1,4 +1,4 @@
-<div class="tabs arrows" xmlns:w="client" forward="onMoveDate(${arg.type})"
+<div class="tabs arrows ${arg.fontClass}" xmlns:w="client" forward="onMoveDate(${arg.type})"
 	w:unbind_="function(skipper, after){this.$unbind_(skipper, after);jq(this).unbind('mouseover').unbind('mouseout');}">
 	<attribute w:name="bind_"><![CDATA[ 
 		function (desktop, skipper, after) {