diff --git a/demo/backend/ui/ui-elements/forms/text-field/_basic/index.xml.njk b/demo/backend/ui/ui-elements/forms/text-field/_basic/index.xml.njk
new file mode 100644
index 000000000..c2e765a63
--- /dev/null
+++ b/demo/backend/ui/ui-elements/forms/text-field/_basic/index.xml.njk
@@ -0,0 +1,12 @@
+<view style="form-group">
+  <text style="label">Basic</text>
+  <text-field
+    style="text-field-basic"
+    name="text-field-basic"
+    placeholder="Placeholder"
+    placeholderTextColor="#8D9494"
+    selectionColor="#4778FF"
+    cursorColor="#4778FF"
+    value=""
+  />
+</view>
diff --git a/demo/backend/ui/ui-elements/forms/text-field/_basic/styles.xml.njk b/demo/backend/ui/ui-elements/forms/text-field/_basic/styles.xml.njk
new file mode 100644
index 000000000..246dd8baf
--- /dev/null
+++ b/demo/backend/ui/ui-elements/forms/text-field/_basic/styles.xml.njk
@@ -0,0 +1,16 @@
+<style
+  id="text-field-basic"
+  borderBottomColor="#E1E1E1"
+  borderBottomWidth="1"
+  flex="1"
+  fontSize="16"
+  fontWeight="normal"
+  paddingVertical="8"
+>
+  <modifier pressed="true">
+    <style borderBottomColor="#4778FF"/>
+  </modifier>
+  <modifier focused="true">
+    <style borderBottomColor="#4778FF"/>
+  </modifier>
+</style>
diff --git a/demo/backend/ui/ui-elements/forms/text-field/_multiline/index.xml.njk b/demo/backend/ui/ui-elements/forms/text-field/_multiline/index.xml.njk
new file mode 100644
index 000000000..fe8c2bbbd
--- /dev/null
+++ b/demo/backend/ui/ui-elements/forms/text-field/_multiline/index.xml.njk
@@ -0,0 +1,13 @@
+<view style="form-group">
+  <text style="label">Multi-line</text>
+  <text-field
+    style="text-field-multiline"
+    multiline="true"
+    name="text-field-multiline"
+    placeholder="Placeholder"
+    placeholderTextColor="#8D9494"
+    selectionColor="#4778FF"
+    cursorColor="#4778FF"
+    value=""
+  />
+</view>
diff --git a/demo/backend/ui/ui-elements/forms/text-field/_multiline/styles.xml.njk b/demo/backend/ui/ui-elements/forms/text-field/_multiline/styles.xml.njk
new file mode 100644
index 000000000..ada66f13d
--- /dev/null
+++ b/demo/backend/ui/ui-elements/forms/text-field/_multiline/styles.xml.njk
@@ -0,0 +1,19 @@
+<style
+  id="text-field-multiline"
+  borderRadius="6"
+  borderWidth="1"
+  borderColor="#E1E1E1"
+  flex="1"
+  fontSize="16"
+  fontWeight="normal"
+  height="120"
+  padding="8"
+  textAlignVertical="top"
+>
+  <modifier pressed="true">
+    <style borderColor="#4778FF"/>
+  </modifier>
+  <modifier focused="true">
+    <style borderColor="#4778FF"/>
+  </modifier>
+</style>
diff --git a/demo/backend/ui/ui-elements/forms/text-field/index.xml.njk b/demo/backend/ui/ui-elements/forms/text-field/index.xml.njk
new file mode 100644
index 000000000..7a1d3586b
--- /dev/null
+++ b/demo/backend/ui/ui-elements/forms/text-field/index.xml.njk
@@ -0,0 +1,32 @@
+---
+permalink: "/ui/ui-elements/forms/text-field/index.xml"
+tags: "UI/UI Elements/Forms"
+hv_title: "Text Field"
+hv_button_behavior: "back"
+---
+{% extends 'templates/scrollview.xml.njk' %}
+{% from 'macros/about/index.xml.njk' import about %}
+{% from 'macros/description/index.xml.njk' import description %}
+{% from 'macros/button/index.xml.njk' import button %}
+
+{% block styles %}
+  <style id="form-group" flex="1" marginLeft="24" marginRight="24" marginTop="48"/>
+  <style
+    id="label"
+    borderColor="#4E4D4D"
+    fontSize="16"
+    fontWeight="bold"
+    lineHeight="24"
+    marginBottom="8"
+  />
+  {% include './_basic/styles.xml.njk' %}
+  {% include './_multiline/styles.xml.njk' %}
+{% endblock %}
+
+{% block content %}
+  {{ about('Text field are used in forms to collect textual data') }}
+  <form>
+    {% include './_basic/index.xml.njk' %}
+    {% include './_multiline/index.xml.njk' %}
+  </form>
+{% endblock %}
diff --git a/docs/reference_textfield.md b/docs/reference_textfield.md
index 8d130ddda..100fd805f 100644
--- a/docs/reference_textfield.md
+++ b/docs/reference_textfield.md
@@ -27,6 +27,9 @@ A `<text-field>` element can appear anywhere within a `<form>` element.
 - [`name`](#name)
 - [`value`](#value)
 - [`placeholder`](#placeholder)
+- [`placeholderTextColor`](#placeholdertextcolor)
+- [`selectionColor`](#selectioncolor)
+- [`cursorColor`](#cursorcolor)
 - [`multiline`](#multiline)
 - [`keyboard-type`](#keyboard-type)
 - [`mask`](#mask)
@@ -68,6 +71,30 @@ The value of the field. This string gets rendered into the string and can be edi
 
 A label that appears within the text field. The placeholder only appears when the field is empty.
 
+#### `placeholderTextColor`
+
+| Type   | Required |
+| ------ | -------- |
+| string | No       |
+
+The text color of the placeholder string.
+
+#### `selectionColor`
+
+| Type   | Required |
+| ------ | -------- |
+| string | No       |
+
+The highlight, selection handle and cursor color of the text input.
+
+#### `cursorColor` (Android)
+
+| Type   | Required |
+| ------ | -------- |
+| string | No       |
+
+When provided it will set the color of the cursor (or "caret") in the component. Unlike the behavior of `selectionColor` the cursor color will be set independently from the color of the text selection box.
+
 #### `multiline`
 
 | Type                      | Required |
diff --git a/schema/core.xsd b/schema/core.xsd
index 7f2fd340d..5e39906f5 100644
--- a/schema/core.xsd
+++ b/schema/core.xsd
@@ -752,6 +752,17 @@
         </xs:simpleType>
       </xs:attribute>
 
+      <xs:attribute name="textAlignVertical">
+        <xs:simpleType>
+          <xs:restriction base="xs:string">
+            <xs:enumeration value="auto" />
+            <xs:enumeration value="top" />
+            <xs:enumeration value="bottom" />
+            <xs:enumeration value="center" />
+          </xs:restriction>
+        </xs:simpleType>
+      </xs:attribute>
+
       <xs:attribute name="textDecorationLine" type="xs:NCName" />
       <xs:attribute name="top" type="hv:pointsOrPercent" />
       <xs:attribute name="width" type="hv:pointsOrPercent" />
@@ -1093,6 +1104,8 @@
       <xs:attribute name="value" type="xs:string" />
       <xs:attribute name="placeholder" type="xs:string" />
       <xs:attribute name="placeholderTextColor" type="hv:color" />
+      <xs:attribute name="selectionColor" type="hv:color" />
+      <xs:attribute name="cursorColor" type="hv:color" />
       <xs:attribute name="keyboard-type">
         <xs:simpleType>
           <xs:restriction base="xs:string">
diff --git a/src/services/stylesheets/index.ts b/src/services/stylesheets/index.ts
index b5031fe9c..22188980f 100644
--- a/src/services/stylesheets/index.ts
+++ b/src/services/stylesheets/index.ts
@@ -138,6 +138,7 @@ const STYLE_ATTRIBUTE_CONVERTERS = {
   fontWeight: string,
   lineHeight: number,
   textAlign: string,
+  textAlignVertical: string,
   textDecorationLine: string,
   textShadowColor: string,
   textShadowRadius: number,