diff --git a/applets/digital-clock/package/contents/ui/DateFormatTable.qml b/applets/digital-clock/package/contents/ui/DateFormatTable.qml
new file mode 100644
--- /dev/null
+++ b/applets/digital-clock/package/contents/ui/DateFormatTable.qml
@@ -0,0 +1,105 @@
+/*
+ * Copyright 2019 Chris Holland <zrenfire@gmail.com>
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU General Public License as
+ * published by the Free Software Foundation; either version 2 of
+ * the License or (at your option) version 3 or any later version
+ * accepted by the membership of KDE e.V. (or its successor approved
+ * by the membership of KDE e.V.), which shall act as a proxy
+ * defined in Section 14 of version 3 of the license.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>
+ */
+
+import QtQuick 2.8
+import QtQuick.Controls 2.3 as QtControls
+import QtQuick.Layouts 1.0 as QtLayouts
+import org.kde.plasma.core 2.0 as PlasmaCore
+
+QtLayouts.GridLayout {
+    id: dateFormatTable
+    columns: 2
+
+    property var dateTime: new Date(1976, 3, 1, 23, 59, 34)
+    property var model: ["ddd"]
+
+    signal dateFormatClicked(string dateFormat)
+
+    Repeater {
+        model: dateFormatTable.model.length * 2
+
+        Item {
+            id: cell
+            readonly property int modelIndex: Math.floor(index / 2)
+            readonly property string dateFormat: dateFormatTable.model[cell.modelIndex]
+            readonly property int row: Math.floor(index / dateFormatTable.columns)
+            readonly property int column: index % dateFormatTable.columns
+            readonly property bool isVariable: index % 2 == 0
+            readonly property bool needsExtraSpacing: !isVariable && column+1 != dateFormatTable.columns
+            readonly property int extraSpacing: needsExtraSpacing ? units.smallSpacing : 0
+            QtLayouts.Layout.fillWidth: true
+            // QtLayouts.Layout.alignment: cell.isVariable ? Qt.AlignRight : Qt.AlignLeft
+            implicitWidth: cellButton.implicitWidth + extraSpacing
+            implicitHeight: cellButton.implicitHeight
+
+            Item {
+                id: cellButton
+                anchors.fill: Drag.active ? undefined : parent
+                anchors.rightMargin: cell.extraSpacing
+                property int padding: units.smallSpacing
+                implicitWidth: exampleLabel.implicitWidth + padding*2
+                implicitHeight: exampleLabel.implicitHeight + padding*2
+
+                Drag.active: mouseArea.drag.active
+                Drag.mimeData: { "text/plain": cell.dateFormat }
+                Drag.proposedAction: Qt.CopyAction
+                Drag.dragType: Drag.Automatic
+
+                Rectangle {
+                    anchors.fill: parent
+                    color: mouseArea.containsMouse ? PlasmaCore.ColorScope.highlightColor : exampleLabel.color
+                    opacity: cell.isVariable ? 0.2 : 0.1
+                    radius: cellButton.padding
+                }
+
+                QtControls.Label {
+                    id: exampleLabel
+                    anchors.fill: parent
+                    anchors.margins: cellButton.padding
+                    // horizontalAlignment: Text.AlignHCenter
+                    textFormat: cell.isVariable ? Text.PlainText : Text.RichText
+                    text: {
+                        if (cell.isVariable) {
+                            return cell.dateFormat;
+                        } else {
+                            return Qt.formatDate(dateFormatTable.dateTime, cell.dateFormat);
+                        }
+                    }
+                }
+
+                MouseArea {
+                    id: mouseArea
+                    anchors.fill: parent
+                    hoverEnabled: true
+                    cursorShape: Qt.PointingHandCursor
+                    onClicked: dateFormatTable.dateFormatClicked(dateFormat)
+                    
+                    drag.target: cellButton
+                    onPressed: {
+                        drag.target.grabToImage(function(result) {
+                            drag.target.Drag.imageSource = result.url;
+                        });
+                    }
+                }
+            }
+        }
+
+    }
+}
diff --git a/applets/digital-clock/package/contents/ui/configAppearance.qml b/applets/digital-clock/package/contents/ui/configAppearance.qml
--- a/applets/digital-clock/package/contents/ui/configAppearance.qml
+++ b/applets/digital-clock/package/contents/ui/configAppearance.qml
@@ -23,6 +23,7 @@
 import QtQuick 2.0
 import QtQuick.Controls 2.3 as QtControls
 import QtQuick.Layouts 1.0 as QtLayouts
+import org.kde.plasma.core 2.0 as PlasmaCore
 import org.kde.plasma.calendar 2.0 as PlasmaCalendar
 import org.kde.kirigami 2.5 as Kirigami
 
@@ -159,6 +160,31 @@
             id: dateFormatTextField
             QtLayouts.Layout.fillWidth: true
             visible: cfg_dateFormat == "custom"
+
+            function addVariable(dateFormat) {
+                if (text.length > 0) {
+                    insert(cursorPosition, " ");
+                }
+                insert(cursorPosition, dateFormat);
+            }
+
+            // QML's TextField does not support dropping text
+            // https://bugreports.qt.io/browse/QTBUG-57943
+            DropArea {
+                anchors.fill: parent
+                onDropped: {
+                    if (drop.hasText) {
+                        drop.accept();
+                        dateFormatTextField.addVariable(drop.text);
+                    }
+                }
+                Rectangle {
+                    anchors.fill: parent
+                    color: "transparent"
+                    border.width: 1 * units.devicePixelRatio
+                    border.color: parent.containsDrag ? PlasmaCore.ColorScope.highlightColor : "transparent"
+                }
+            }
         }
 
         QtControls.Label {
@@ -176,6 +202,24 @@
             }
         }
 
+        DateFormatTable {
+            visible: cfg_dateFormat == "custom"
+            columns: 8
+            model: [
+                "dddd",
+                "ddd",
+                "dd",
+                "d",
+                "MMMM",
+                "MMM",
+                "MM",
+                "M",
+                "yyyy",
+                "yy",
+            ]
+            onDateFormatClicked: dateFormatTextField.addVariable(dateFormat)
+        }
+
         Item {
             Kirigami.FormData.isSection: true
         }