diff --git a/CrossPlatformModules.csproj b/CrossPlatformModules.csproj
index 4eeb1d5ca..02cbc7f68 100644
--- a/CrossPlatformModules.csproj
+++ b/CrossPlatformModules.csproj
@@ -150,6 +150,7 @@
     <TypeScriptCompile Include="apps\tests\ui\repeaterItems-bindingToGestures.ts" />
     <TypeScriptCompile Include="apps\tests\xml-declaration\inherited-base-page.ts" />
     <TypeScriptCompile Include="apps\tests\xml-declaration\inherited-page.ts" />
+    <Content Include="apps\ui-tests-app\app.css" />
     <TypeScriptCompile Include="apps\ui-tests-app\pages\handlers.ts" />
     <TypeScriptCompile Include="apps\ui-tests-app\pages\htmlview.ts" />
     <TypeScriptCompile Include="ui\animation\animation.d.ts" />
@@ -933,6 +934,10 @@
     <Content Include="apps\tests\xml-declaration\mymodulewithxml\MyControl.css" />
     <Content Include="apps\tests\xml-declaration\mymodule\MyControl.css" />
     <Content Include="apps\ui-tests-app\bindings\xmlbasics.xml" />
+    <TypeScriptCompile Include="apps\ui-tests-app\css\styles.ts" />
+    <Content Include="apps\ui-tests-app\css\import.css" />
+    <Content Include="apps\ui-tests-app\css\styles.css" />
+    <Content Include="apps\ui-tests-app\css\styles.xml" />
     <Content Include="apps\ui-tests-app\dialogs\dialogs.xml" />
     <Content Include="apps\ui-tests-app\image-view\gravatar.png" />
     <Content Include="apps\ui-tests-app\image-view\roundimg.css" />
@@ -953,7 +958,7 @@
     <Content Include="apps\template-tab-navigation\app.css" />
     <Content Include="apps\ui-tests-app\modal-view\login-page.xml" />
     <Content Include="apps\ui-tests-app\modal-view\modalview.xml" />
-    <Content Include="apps\ui-tests-app\pages\red.png" />
+    <Content Include="apps\ui-tests-app\image-view\red.png" />
     <Content Include="apps\ui-tests-app\pages\test2.png" />
     <Content Include="apps\ui-tests-app\pages\textfield.xml" />
     <Content Include="apps\ui-tests-app\pages\text\text-field.xml" />
diff --git a/apps/ui-tests-app/app.css b/apps/ui-tests-app/app.css
new file mode 100644
index 000000000..6405512e2
--- /dev/null
+++ b/apps/ui-tests-app/app.css
@@ -0,0 +1,3 @@
+#app {
+    background-color: lightblue;
+}
\ No newline at end of file
diff --git a/apps/ui-tests-app/css/import.css b/apps/ui-tests-app/css/import.css
new file mode 100644
index 000000000..0478fb434
--- /dev/null
+++ b/apps/ui-tests-app/css/import.css
@@ -0,0 +1,3 @@
+#import {
+    background-color: lightpink;
+}
\ No newline at end of file
diff --git a/apps/ui-tests-app/css/styles.css b/apps/ui-tests-app/css/styles.css
new file mode 100644
index 000000000..e0d1ce22d
--- /dev/null
+++ b/apps/ui-tests-app/css/styles.css
@@ -0,0 +1,5 @@
+#page {
+    background-color: lightcoral;
+}
+
+@import url('~/css/import.css');
\ No newline at end of file
diff --git a/apps/ui-tests-app/css/styles.ts b/apps/ui-tests-app/css/styles.ts
new file mode 100644
index 000000000..05b053e62
--- /dev/null
+++ b/apps/ui-tests-app/css/styles.ts
@@ -0,0 +1,4 @@
+export function onLoaded(args) {
+    var page = args.object;
+    page.addCss("#property { background-color: lightsalmon; }");
+}
\ No newline at end of file
diff --git a/apps/ui-tests-app/css/styles.xml b/apps/ui-tests-app/css/styles.xml
new file mode 100644
index 000000000..572be76a5
--- /dev/null
+++ b/apps/ui-tests-app/css/styles.xml
@@ -0,0 +1,9 @@
+<Page loaded="onLoaded">
+  <WrapLayout>
+    <Button id="app" text="app" />
+    <Button id="inline" text="inline" style="background-color: lightgreen;" />
+    <Button id="page" text="page" />
+    <Button id="property" text="property" />
+    <Button id="import" text="import" />
+  </WrapLayout>
+</Page>
\ No newline at end of file
diff --git a/apps/ui-tests-app/pages/red.png b/apps/ui-tests-app/image-view/red.png
similarity index 100%
rename from apps/ui-tests-app/pages/red.png
rename to apps/ui-tests-app/image-view/red.png
diff --git a/apps/ui-tests-app/image-view/roundbtn.xml b/apps/ui-tests-app/image-view/roundbtn.xml
index eaf569e78..4c8340753 100644
--- a/apps/ui-tests-app/image-view/roundbtn.xml
+++ b/apps/ui-tests-app/image-view/roundbtn.xml
@@ -1,6 +1,6 @@
 <Page>
   <StackLayout>
     <Button text="ButtonCircle" style="width:200;height:200;color:white;border-radius:100;border-width:2;border-color:red;background-color:blue" />
-    <Button text="ButtonImage"  style="width:200;height:200;color:white;border-radius:100;border-width:2;border-color:blue;background-image:url('~/pages/red.png')" />
+    <Button text="ButtonImage"  style="width:200;height:200;color:white;border-radius:100;border-width:2;border-color:blue;background-image:url('~/image-view/red.png')" />
   </StackLayout>
 </Page>
\ No newline at end of file
diff --git a/apps/ui-tests-app/mainPage.ts b/apps/ui-tests-app/mainPage.ts
index 39dd6cb16..04c513df8 100644
--- a/apps/ui-tests-app/mainPage.ts
+++ b/apps/ui-tests-app/mainPage.ts
@@ -10,7 +10,7 @@ import trace = require("trace");
 trace.enable();
 trace.setCategories(trace.categories.Test);
 
-var list: string[] = ["pages", "layouts", "modal-view", "bindings", "dialogs", "web-view", "image-view"];
+var list: string[] = ["pages", "bindings", "css", "dialogs", "layouts", "modal-view", "web-view", "image-view"];
 
 // basePath is auto-changed when building multiple apps
 var basePath = "";