diff --git a/source/qml_v2/AdaptiveCardQmlEngine/AdaptiveCardQmlTypes.h b/source/qml_v2/AdaptiveCardQmlEngine/AdaptiveCardQmlTypes.h
index b05db40478..0f0cd24b6e 100644
--- a/source/qml_v2/AdaptiveCardQmlEngine/AdaptiveCardQmlTypes.h
+++ b/source/qml_v2/AdaptiveCardQmlEngine/AdaptiveCardQmlTypes.h
@@ -31,5 +31,9 @@ namespace AdaptiveCardQmlEngine
         qmlRegisterType(QUrl("qrc:qml/InputErrorMessage.qml"), "AdaptiveCardQmlEngine", 1, 0, "InputErrorMessage");
         qmlRegisterType(QUrl("qrc:qml/InputFieldClearIcon.qml"), "AdaptiveCardQmlEngine", 1, 0, "InputFieldClearIcon");
         qmlRegisterType(QUrl("qrc:qml/MultiLineTextInputRender.qml"), "AdaptiveCardQmlEngine", 1, 0, "MultiLineTextInputRender");
+        qmlRegisterType(QUrl("qrc:qml/TimeInputRender.qml"), "AdaptiveCardQmlEngine", 1, 0, "TimeInputRender");
+        qmlRegisterType(QUrl("qrc:qml/TimeInputPopout.qml"), "AdaptiveCardQmlEngine", 1, 0, "TimeInputPopout");
+        qmlRegisterType(QUrl("qrc:qml/TimeInputTextField.qml"), "AdaptiveCardQmlEngine", 1, 0, "TimeInputTextField");
+        qmlRegisterType(QUrl("qrc:qml/TimePickerListView.qml"), "AdaptiveCardQmlEngine", 1, 0, "TimePickerListView");
     }
 } // namespace RendererQml
diff --git a/source/qml_v2/AdaptiveCardQmlEngine/CMakeLists.txt b/source/qml_v2/AdaptiveCardQmlEngine/CMakeLists.txt
index 8efa915618..9fcd4dc017 100644
--- a/source/qml_v2/AdaptiveCardQmlEngine/CMakeLists.txt
+++ b/source/qml_v2/AdaptiveCardQmlEngine/CMakeLists.txt
@@ -59,6 +59,7 @@ file(GLOB_RECURSE SOURCES
 	"ImageModel.cpp"
 	"RichTextBlockModel.cpp"
         "TextInputModel.cpp"
+        "TimeInputModel.cpp"
 	
 	"AdaptiveCardQmlTypes.h"
 	"AdaptiveCardUtils.cpp"
@@ -82,6 +83,7 @@ file(GLOB_RECURSE SOURCES
 	"TextBlockModel.h"
 	"RichTextBlockModel.h"
         "TextInputModel.h"
+	"TimeInputModel.h"
 )
 
 # Setup Library
diff --git a/source/qml_v2/AdaptiveCardQmlEngine/models/CollectionItemModel.cpp b/source/qml_v2/AdaptiveCardQmlEngine/models/CollectionItemModel.cpp
index 0af2083ebd..9ad82f9a44 100644
--- a/source/qml_v2/AdaptiveCardQmlEngine/models/CollectionItemModel.cpp
+++ b/source/qml_v2/AdaptiveCardQmlEngine/models/CollectionItemModel.cpp
@@ -3,6 +3,7 @@
 #include "ImageModel.h"
 #include "RichTextBlockModel.h"
 #include "TextInputModel.h"
+#include "TimeInputModel.h"
 #include "AdaptiveCardEnums.h"
 
 CollectionItemModel::CollectionItemModel(std::vector<std::shared_ptr<AdaptiveCards::BaseCardElement>> elements, QObject* parent) :
@@ -45,6 +46,7 @@ QHash<int, QByteArray> CollectionItemModel::roleNames() const
     cardListModel[ImageRole] = "imageRole";
     cardListModel[RichTextBlockRole] = "richTextBlockRole";
     cardListModel[TextInputRole] = "textInputRole";
+    cardListModel[TimeInputRole] = "timeInputRole";
     cardListModel[FillHeightRole] = "fillHeightRole";
 
     return cardListModel;
@@ -69,6 +71,9 @@ void CollectionItemModel::populateRowData(std::shared_ptr<AdaptiveCards::BaseCar
     case AdaptiveCards::CardElementType::TextInput:
         populateTextInputModel(std::dynamic_pointer_cast<AdaptiveCards::TextInput>(element), rowContent);
         break;
+    case AdaptiveCards::CardElementType::TimeInput:
+        populateTimeInputModel(std::dynamic_pointer_cast<AdaptiveCards::TimeInput>(element), rowContent);
+        break;
     default:
         break;
     }
@@ -97,3 +102,9 @@ void CollectionItemModel::populateTextInputModel(std::shared_ptr<AdaptiveCards::
     rowContent[CollectionModelRole::DelegateType] = QVariant::fromValue(AdaptiveCardEnums::CardElementType::TextInput);
     rowContent[CollectionModelRole::TextInputRole] = QVariant::fromValue(new TextInputModel(input, nullptr));
 }
+
+void CollectionItemModel::populateTimeInputModel(std::shared_ptr<AdaptiveCards::TimeInput> input, RowContent& rowContent)
+{
+    rowContent[CollectionModelRole::DelegateType] = QVariant::fromValue(AdaptiveCardEnums::CardElementType::TimeInput);
+    rowContent[CollectionModelRole::TimeInputRole] = QVariant::fromValue(new TimeInputModel(input, nullptr));
+}
diff --git a/source/qml_v2/AdaptiveCardQmlEngine/models/CollectionItemModel.h b/source/qml_v2/AdaptiveCardQmlEngine/models/CollectionItemModel.h
index 03d7c6e173..fcca179d79 100644
--- a/source/qml_v2/AdaptiveCardQmlEngine/models/CollectionItemModel.h
+++ b/source/qml_v2/AdaptiveCardQmlEngine/models/CollectionItemModel.h
@@ -7,12 +7,14 @@
 #include <RichTextBlock.h>
 #include <Image.h>
 #include <TextInput.h>
+#include <TimeInput.h>
 #include "Enums.h"
 
 class TextBlockModel;
 class RichTextBlockModel;
 class ImageModel;
 class TextInputModel;
+class TimeInputModel;
 
 class CollectionItemModel : public QAbstractListModel
 {
@@ -25,6 +27,7 @@ class CollectionItemModel : public QAbstractListModel
         ImageRole,
         RichTextBlockRole,
         TextInputRole,
+        TimeInputRole,
         FillHeightRole
     };
 
@@ -48,4 +51,5 @@ class CollectionItemModel : public QAbstractListModel
     void populateImageModel(std::shared_ptr<AdaptiveCards::Image> image, RowContent& rowContent);
     void populateRichTextBlockModel(std::shared_ptr<AdaptiveCards::RichTextBlock> rightTextBlock, RowContent& rowContent);
     void populateTextInputModel(std::shared_ptr<AdaptiveCards::TextInput> input, RowContent& rowContent);
+    void populateTimeInputModel(std::shared_ptr<AdaptiveCards::TimeInput> input, RowContent& rowContent);
 };
diff --git a/source/qml_v2/AdaptiveCardQmlEngine/models/TimeInputModel.cpp b/source/qml_v2/AdaptiveCardQmlEngine/models/TimeInputModel.cpp
new file mode 100644
index 0000000000..780fc2792d
--- /dev/null
+++ b/source/qml_v2/AdaptiveCardQmlEngine/models/TimeInputModel.cpp
@@ -0,0 +1,13 @@
+#include "TimeInputModel.h"
+#include "SharedAdaptiveCard.h"
+#include <QDebug.h>
+#include "Utils.h"
+#include "MarkDownParser.h"
+
+TimeInputModel::TimeInputModel(std::shared_ptr<AdaptiveCards::TimeInput> input, QObject* parent) :
+	QObject(parent)
+{
+}
+
+TimeInputModel::~TimeInputModel()
+{}
diff --git a/source/qml_v2/AdaptiveCardQmlEngine/models/TimeInputModel.h b/source/qml_v2/AdaptiveCardQmlEngine/models/TimeInputModel.h
new file mode 100644
index 0000000000..55c895e6db
--- /dev/null
+++ b/source/qml_v2/AdaptiveCardQmlEngine/models/TimeInputModel.h
@@ -0,0 +1,19 @@
+#pragma once
+
+#include <QObject>
+#include <QColor>
+#include <QFont>
+
+#include "AdaptiveCardContext.h"
+#include "TimeInput.h"
+
+class TimeInputModel : public QObject
+{
+    Q_OBJECT
+
+	public:
+    explicit TimeInputModel(std::shared_ptr<AdaptiveCards::TimeInput> input, QObject* parent = nullptr);
+    ~TimeInputModel();
+};
+
+
diff --git a/source/qml_v2/AdaptiveCardQmlEngine/qml/CollectionItemDelegate.qml b/source/qml_v2/AdaptiveCardQmlEngine/qml/CollectionItemDelegate.qml
index 6b82194e3f..5d431fb10c 100644
--- a/source/qml_v2/AdaptiveCardQmlEngine/qml/CollectionItemDelegate.qml
+++ b/source/qml_v2/AdaptiveCardQmlEngine/qml/CollectionItemDelegate.qml
@@ -15,6 +15,8 @@ Loader {
         else if (model.delegateType == AdaptiveCardEnums.CardElementType.RichTextBlock)
             source = "RichTextBlockRender.qml";
         else if (model.delegateType == AdaptiveCardEnums.CardElementType.TextInput)
-            source = "TextInputRender.qml"
+            source = "TextInputRender.qml";
+        else if (model.delegateType == AdaptiveCardEnums.CardElementType.TimeInput)
+            source = "TimeInputRender.qml"
     }
 }
diff --git a/source/qml_v2/AdaptiveCardQmlEngine/qml/InputErrorMessage.qml b/source/qml_v2/AdaptiveCardQmlEngine/qml/InputErrorMessage.qml
index db4674311e..337874a1e9 100644
--- a/source/qml_v2/AdaptiveCardQmlEngine/qml/InputErrorMessage.qml
+++ b/source/qml_v2/AdaptiveCardQmlEngine/qml/InputErrorMessage.qml
@@ -7,7 +7,7 @@ import "JSUtils/AdaptiveCardUtils.js" as AdaptiveCardUtils
 Rectangle {
     id: errorMessage
 
-    property string errorMessage
+    property string isErrorMessage
 
     width: parent.width
     height: errorMessageLabel.implicitHeight
@@ -16,17 +16,17 @@ Rectangle {
     Button {
         id: errorIcon
 
-        width: cardConst.inputFieldConstants.errorIconWidth
+        width: CardConstants.inputFieldConstants.errorIconWidth
         anchors.left: parent.left
-        anchors.leftMargin: cardConst.inputFieldConstants.errorIconLeftMargin
-        anchors.topMargin: cardConst.inputFieldConstants.errorIconTopMargin
+        anchors.leftMargin: CardConstants.inputFieldConstants.errorIconLeftMargin
+        anchors.topMargin: CardConstants.inputFieldConstants.errorIconTopMargin
         horizontalPadding: 0
         verticalPadding: 0
-        icon.width: cardConst.inputFieldConstants.errorIconWidth
-        icon.height: cardConst.inputFieldConstants.errorIconHeight
-        icon.color: cardConst.toggleButtonConstants.errorMessageColor
+        icon.width: CardConstants.inputFieldConstants.errorIconWidth
+        icon.height: CardConstants.inputFieldConstants.errorIconHeight
+        icon.color: CardConstants.toggleButtonConstants.errorMessageColor
         anchors.top: parent.top
-        icon.source: cardConst.errorIcon
+        icon.source: CardConstants.errorIcon
         enabled: false
 
         background: Rectangle {
@@ -38,12 +38,12 @@ Rectangle {
         id: errorMessageLabel
 
         wrapMode: Text.Wrap
-        font.pixelSize: cardConst.inputFieldConstants.labelPixelSize
+        font.pixelSize: CardConstants.inputFieldConstants.labelPixelSize
         Accessible.ignored: true
-        color: cardConst.toggleButtonConstants.errorMessageColor
+        color: CardConstants.toggleButtonConstants.errorMessageColor
         anchors.left: errorIcon.right
-        anchors.leftMargin: cardConst.inputFieldConstants.errorIconLeftMargin
+        anchors.leftMargin: CardConstants.inputFieldConstants.errorIconLeftMargin
         anchors.right: parent.right
-        text: textInputModel.errorMessage//_errorMessage
+        text: isErrorMessage
     }
 }
diff --git a/source/qml_v2/AdaptiveCardQmlEngine/qml/InputFieldClearIcon.qml b/source/qml_v2/AdaptiveCardQmlEngine/qml/InputFieldClearIcon.qml
index 212632336e..be62e56693 100644
--- a/source/qml_v2/AdaptiveCardQmlEngine/qml/InputFieldClearIcon.qml
+++ b/source/qml_v2/AdaptiveCardQmlEngine/qml/InputFieldClearIcon.qml
@@ -7,19 +7,19 @@ import "JSUtils/AdaptiveCardUtils.js" as AdaptiveCardUtils
 Button {
     id: inputFieldClearIcon
 
-    width: cardConst.inputFieldConstants.clearIconSize
+    width: CardConstants.inputFieldConstants.clearIconSize
     horizontalPadding: 0
     verticalPadding: 0
-    icon.width: cardConst.inputFieldConstants.clearIconSize
-    icon.height: cardConst.inputFieldConstants.clearIconSize
-    icon.color: cardConst.inputFieldConstants.clearIconColorNormal
-    icon.source: cardConst.clearIconImage
+    icon.width: CardConstants.inputFieldConstants.clearIconSize
+    icon.height: CardConstants.inputFieldConstants.clearIconSize
+    icon.color: CardConstants.inputFieldConstants.clearIconColorNormal
+    icon.source: CardConstants.clearIconImage
     Accessible.name: qsTr("Clear Input")
     Accessible.role: Accessible.Button
 
     background: Rectangle {
         color: 'transparent'
-        radius: cardConst.inputFieldConstants.borderRadius
+        radius: CardConstants.inputFieldConstants.borderRadius
 
         WCustomFocusItem {
             isRectangle: true
diff --git a/source/qml_v2/AdaptiveCardQmlEngine/qml/InputLabel.qml b/source/qml_v2/AdaptiveCardQmlEngine/qml/InputLabel.qml
index b0ebcd75db..e8b735c679 100644
--- a/source/qml_v2/AdaptiveCardQmlEngine/qml/InputLabel.qml
+++ b/source/qml_v2/AdaptiveCardQmlEngine/qml/InputLabel.qml
@@ -8,11 +8,12 @@ Label {
     id: inputLabel
 
     property bool required
+    property string label
  
     wrapMode: Text.Wrap
     width: parent.width
-    color: cardConst.toggleButtonConstants.textColor
-    font.pixelSize: cardConst.inputFieldConstants.labelPixelSize
+    color: CardConstants.toggleButtonConstants.textColor
+    font.pixelSize: CardConstants.inputFieldConstants.labelPixelSize
     Accessible.ignored: true
-    text: textInputModel.isRequired ? AdaptiveCardUtils.escapeHtml(textInputModel.label) + " " + "<font color='" + cardConst.inputFieldConstants.errorMessageColor + "'>*</font>" : AdaptiveCardUtils.escapeHtml(textInputModel.label)
+    text: required ? AdaptiveCardUtils.escapeHtml(label) + " " + "<font color='" + CardConstants.inputFieldConstants.errorMessageColor + "'>*</font>" : AdaptiveCardUtils.escapeHtml(label)
 }
diff --git a/source/qml_v2/AdaptiveCardQmlEngine/qml/TextInputRender.qml b/source/qml_v2/AdaptiveCardQmlEngine/qml/TextInputRender.qml
index 5a85d23a81..76ab3d1162 100644
--- a/source/qml_v2/AdaptiveCardQmlEngine/qml/TextInputRender.qml
+++ b/source/qml_v2/AdaptiveCardQmlEngine/qml/TextInputRender.qml
@@ -67,6 +67,7 @@ Column {
     InputLabel {
         id: inputTextLabel
         
+        label: textInputModel.label
         required: textInputModel.isRequired
         visible: textInputModel.label
     } 
@@ -118,7 +119,7 @@ Column {
     InputErrorMessage {
         id: inputtextErrorMessage
 
-        errorMessage: textInputModel.errorMessage
+        isErrorMessage: textInputModel.errorMessage
         visible: showErrorMessage
     }
 }
\ No newline at end of file
diff --git a/source/qml_v2/AdaptiveCardQmlEngine/qml/TimeInputPopout.qml b/source/qml_v2/AdaptiveCardQmlEngine/qml/TimeInputPopout.qml
new file mode 100644
index 0000000000..892ca7f099
--- /dev/null
+++ b/source/qml_v2/AdaptiveCardQmlEngine/qml/TimeInputPopout.qml
@@ -0,0 +1,82 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.3
+import QtQuick.Controls 2.15
+import AdaptiveCardQmlEngine 1.0
+import "JSUtils/AdaptiveCardUtils.js" as AdaptiveCardUtils
+
+Popup {
+    id: timeInputPopout
+    
+    property var timeInputField
+    property var timeInputElement
+    property bool is12Hour: timeInputElement.is12Hour
+    property var inputFieldConstants: CardConstants.inputFieldConstants
+    property var inputTimeConstants: CardConstants.inputTimeConstants
+    
+    
+    width: contentWidth + (2 * inputFieldConstants.clearIconHorizontalPadding)
+    height: inputTimeConstants.timePickerHeight
+    y: timeInputField.height + inputTimeConstants.timePickerSpacing
+    x: -inputFieldConstants.clearIconSize - inputFieldConstants.clearIconHorizontalPadding
+    onOpened: {
+        timeHours.forceActiveFocus();
+    }
+    onClosed: {
+        updateTime();
+        timeInputField.forceActiveFocus();
+    }
+    
+    background: Rectangle {
+        anchors.fill: parent
+        border.color: inputTimeConstants.timePickerBorderColor
+        radius: inputTimeConstants.timePickerBorderRadius
+        color: inputTimeConstants.timePickerBackgroundColor
+    }
+    
+    contentItem: Rectangle {
+        id: timePickerRectangle
+        
+        height: parent.height
+        implicitWidth: timePickerRLayout.implicitWidth
+        color: 'transparent'
+        Accessible.name: "Time Picker"
+        
+        RowLayout {
+            id: timePickerRLayout
+            
+            height: parent.height
+            spacing: inputTimeConstants.timePickerMargins
+            
+            TimePickerListView {
+                id: timeHours
+                
+                listType: "hours"
+                model: is12Hour ? 12 : 24
+            }
+            
+            TimePickerListView {
+                id: timeMinutes
+                
+                listType: "minutes"
+                model: 60
+            }
+            
+            TimePickerListView {
+                id: timeAMPM
+                
+                listType: "AMPM"
+                visible: is12Hour
+                
+                model: ListModel {
+                    ListElement {
+                        name: "AM"
+                    }
+                    
+                    ListElement {
+                        name: "PM"
+                    }
+                }
+            }
+        }
+    }
+}
diff --git a/source/qml_v2/AdaptiveCardQmlEngine/qml/TimeInputRender.qml b/source/qml_v2/AdaptiveCardQmlEngine/qml/TimeInputRender.qml
new file mode 100644
index 0000000000..42d11dc6de
--- /dev/null
+++ b/source/qml_v2/AdaptiveCardQmlEngine/qml/TimeInputRender.qml
@@ -0,0 +1,122 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.3
+import QtQuick.Controls 2.15
+import AdaptiveCardQmlEngine 1.0
+import "JSUtils/AdaptiveCardUtils.js" as AdaptiveCardUtils
+
+Column {
+    id: timeInput
+    
+    property int minWidth: CardConstants.inputTimeConstants.timeInputMinWidth
+    property var inputFieldConstants: CardConstants.inputFieldConstants
+    property var inputTimeConstants: CardConstants.inputTimeConstants
+    
+    width: parent.width
+    spacing: CardConstants.inputFieldConstants.columnSpacing
+    
+    InputLabel {
+        id: inputTimeLabel
+        
+        label: "Time label"
+        required: true
+        visible: label.length
+    }
+    
+    Rectangle {
+        id: timeWrapper
+        
+        width: parent.width
+        height: inputFieldConstants.height
+        radius: inputFieldConstants.borderRadius
+        color: inputFieldConstants.backgroundColorNormal
+        border.color: true ? inputFieldConstants.borderColorOnError : inputFieldConstants.borderColorNormal
+        border.width: inputFieldConstants.borderWidth
+        
+        ComboBox {
+            id: timeInputCombobox
+            
+            anchors.left: timeInputIcon.right
+            anchors.right: timeInputClearIcon.left
+            focusPolicy: Qt.NoFocus
+            onActiveFocusChanged: colorChange(false)
+            Accessible.ignored: true
+            Keys.onReturnPressed: {
+                setFocusBackOnClose(timeInputCombobox);
+                this.popup.open();
+            }
+            
+            indicator: Rectangle {
+            }
+            
+            popup: TimeInputPopout {
+                id: timeInputPopout
+                
+                timeInputElement: timeInput
+                timeInputField: timeInputTextField
+            }
+            
+            background: TimeInputTextField {
+                id: timeInputTextField                
+            }
+        }
+        
+        Button {
+            id: timeInputIcon
+            
+            width: inputTimeConstants.timeIconButtonSize
+            height: inputTimeConstants.timeIconButtonSize
+            horizontalPadding: 0
+            verticalPadding: 0
+            icon.width: inputTimeConstants.timeIconSize
+            icon.height: inputTimeConstants.timeIconSize
+            icon.color: inputTimeConstants.timeIconColorNormal
+            icon.source: CardConstants.clockIcon
+            Keys.onReturnPressed: onClicked()
+            anchors.left: parent.left
+            anchors.leftMargin: inputTimeConstants.timeIconHorizontalPadding
+            anchors.verticalCenter: parent.verticalCenter
+            onClicked: {
+                timeInputPopout.open();
+            }
+            Accessible.name: qsTr("Time picker")
+            Accessible.role: Accessible.Button
+            
+            background: Rectangle {
+                color: 'transparent'
+                radius: CardConstants.inputFieldConstants.borderRadius
+                
+                WCustomFocusItem {
+                    isRectangle: true
+                    visible: timeInputIcon.activeFocus
+                    designatedParent: parent
+                }
+            }
+        }
+        
+        InputFieldClearIcon {
+            id: timeInputClearIcon
+            
+            anchors.right: parent.right
+            anchors.rightMargin: inputFieldConstants.clearIconHorizontalPadding
+            anchors.verticalCenter: parent.verticalCenter
+            Keys.onReturnPressed: onClicked()
+            
+            onClicked: {
+                timeInputTextField.forceActiveFocus();
+                timeInputTextField.clear();
+            }
+        }
+        
+        WCustomFocusItem {
+            isRectangle: true
+            visible: timeInputTextField.activeFocus
+        }
+    }
+    
+    InputErrorMessage {
+        id: inputTimeErrorMessage
+        
+        isErrorMessage: "Error"
+        visible: true
+    }
+}
diff --git a/source/qml_v2/AdaptiveCardQmlEngine/qml/TimeInputTextField.qml b/source/qml_v2/AdaptiveCardQmlEngine/qml/TimeInputTextField.qml
new file mode 100644
index 0000000000..687a678265
--- /dev/null
+++ b/source/qml_v2/AdaptiveCardQmlEngine/qml/TimeInputTextField.qml
@@ -0,0 +1,33 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.3
+import QtQuick.Controls 2.15
+import AdaptiveCardQmlEngine 1.0
+import "JSUtils/AdaptiveCardUtils.js" as AdaptiveCardUtils
+
+TextField {
+    id: timeInputTextField
+
+    property var inputFieldConstants: CardConstants.inputFieldConstants
+    property var inputTimeConstants: CardConstants.inputTimeConstants
+
+    font.family: "Segoe UI"
+    font.pixelSize: inputFieldConstants.pixelSize
+    selectByMouse: true
+    selectedTextColor: 'white'
+    width: parent.width
+    placeholderTextColor: inputFieldConstants.placeHolderColor
+    placeholderText: ''
+    color: inputFieldConstants.textColor
+    leftPadding: inputFieldConstants.textHorizontalPadding
+    rightPadding: inputFieldConstants.textHorizontalPadding
+    topPadding: inputFieldConstants.textVerticalPadding
+    bottomPadding: inputFieldConstants.textVerticalPadding
+    Accessible.name: ""
+    Accessible.role: Accessible.EditableText
+    onHoveredChanged: timeInputElement.colorChange(false)
+    activeFocusOnTab: true
+
+    background: Rectangle {
+        color: 'transparent'
+    }
+}
diff --git a/source/qml_v2/AdaptiveCardQmlEngine/qml/TimePickerListView.qml b/source/qml_v2/AdaptiveCardQmlEngine/qml/TimePickerListView.qml
new file mode 100644
index 0000000000..54ae12e191
--- /dev/null
+++ b/source/qml_v2/AdaptiveCardQmlEngine/qml/TimePickerListView.qml
@@ -0,0 +1,91 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.3
+import QtQuick.Controls 2.15
+import AdaptiveCardQmlEngine 1.0
+import "JSUtils/AdaptiveCardUtils.js" as AdaptiveCardUtils
+
+ListView {
+    id: timePickerListView
+
+    property string listType
+    property var inputFieldConstants: CardConstants.inputFieldConstants
+    property var inputTimeConstants: CardConstants.inputTimeConstants
+    property var listViewItem: timePickerListView.view
+
+    width: inputTimeConstants.timePickerListViewWidth
+    height: parent.height - inputTimeConstants.timePickerColumnSpacing
+    spacing: inputTimeConstants.timePickerSpacing
+    flickableDirection: Flickable.VerticalFlick
+    boundsBehavior: Flickable.StopAtBounds
+    clip: true
+    Keys.onReturnPressed: timeInputPopout.close()
+    activeFocusOnTab: true
+    Keys.onPressed: {
+        if (event.key === Qt.Key_Right)
+            nextItemInFocusChain().forceActiveFocus();
+        else if (event.key === Qt.Key_Left)
+            nextItemInFocusChain(false).forceActiveFocus();
+        else if (event.key === Qt.Key_Tab)
+            event.accepted = true;
+    }
+    topMargin: inputTimeConstants.timePickerListViewMargins
+    bottomMargin: inputTimeConstants.timePickerListViewMargins
+    leftMargin: inputTimeConstants.timePickerListViewMargins
+    rightMargin: inputTimeConstants.timePickerListViewMargins
+
+    delegate: Rectangle {
+        id: listViewDelegateRect
+
+        function getText() {
+            switch (listType) {
+            case "hours":
+                return String(is12Hour ? index + 1 : index).padStart(2, '0');
+            case "minutes":
+                return String(index).padStart(2, '0');
+            case "AMPM":
+                return model.name;
+            }
+            return '';
+        }
+
+        width: inputTimeConstants.timePickerHoursAndMinutesTagWidth
+        height: inputTimeConstants.timePickerElementHeight
+        radius: inputTimeConstants.timePickerElementRadius
+        color: timePickerListView.currentIndex == index ? inputTimeConstants.timePickerElementColorOnFocus : timePickerListViewmouseArea.containsMouse ? inputTimeConstants.timePickerElementColorOnHover : inputTimeConstants.timePickerElementColorNormal
+        Accessible.name: listType + ' selector ' + timePickerDelegateText.text
+        Accessible.role: Accessible.StaticText
+        Accessible.ignored: true
+
+        MouseArea {
+            id: timePickerListViewmouseArea
+
+            anchors.fill: parent
+            enabled: true
+            hoverEnabled: true
+            onClicked: {
+                forceActiveFocus();
+                timePickerListView.currentIndex = index;
+                updateTime();
+            }
+        }
+
+        Text {
+            id: timePickerDelegateText
+
+            text: getText()
+            anchors.fill: parent
+            horizontalAlignment: Text.AlignHCenter
+            verticalAlignment: Text.AlignVCenter
+            font.pixelSize: inputFieldConstants.pixelSize
+            color: index === timePickerListView.currentIndex ? inputTimeConstants.timePickerElementTextColorHighlighted : inputTimeConstants.timePickerElementTextColorNormal
+        }
+
+        WCustomFocusItem {
+            visible: listViewDelegateRect.activeFocus
+            designatedParent: parent
+            isRectangle: true
+        }
+
+    }
+
+}
diff --git a/source/qml_v2/AdaptiveCardQmlEngine/resourceEngine.qrc b/source/qml_v2/AdaptiveCardQmlEngine/resourceEngine.qrc
index 163cfadb4c..ac48240ee7 100644
--- a/source/qml_v2/AdaptiveCardQmlEngine/resourceEngine.qrc
+++ b/source/qml_v2/AdaptiveCardQmlEngine/resourceEngine.qrc
@@ -22,5 +22,9 @@
         <file>qml/SingleLineTextInputRender.qml</file>
         <file>qml/TextInputRender.qml</file>
         <file>qml/MultiLineTextInputRender.qml</file>
+        <file>qml/TimeInputPopout.qml</file>
+        <file>qml/TimeInputRender.qml</file>
+        <file>qml/TimeInputTextField.qml</file>
+        <file>qml/TimePickerListView.qml</file>
     </qresource>
 </RCC>
diff --git a/source/qml_v2/AdaptiveCardQmlEngine/utils/AdaptiveCardEnums.h b/source/qml_v2/AdaptiveCardQmlEngine/utils/AdaptiveCardEnums.h
index 1f86394bf5..7b0ef469ec 100644
--- a/source/qml_v2/AdaptiveCardQmlEngine/utils/AdaptiveCardEnums.h
+++ b/source/qml_v2/AdaptiveCardQmlEngine/utils/AdaptiveCardEnums.h
@@ -11,6 +11,7 @@ namespace AdaptiveCardEnums
         Image,
         RichTextBlock,
         TextInput,
+        TimeInput,
         Container,
         Column,
         ColumnSet,