diff --git a/apps/theming/js/settings-admin.js b/apps/theming/js/settings-admin.js
index afc218b7ffad10511d8e630794f0c20ad0a9c7fe..28f7645eae7ff7417d0c60512e2cf9f9a3543f19 100644
--- a/apps/theming/js/settings-admin.js
+++ b/apps/theming/js/settings-admin.js
@@ -106,6 +106,10 @@ function hideUndoButton(setting, value) {
 $(document).ready(function () {
 	$('#theming [data-toggle="tooltip"]').tooltip();
 
+	// manually instantiate jscolor to work around new Function call which violates strict CSP
+	var colorElement = $('#theming-color')[0];
+	var jscolor = new window.jscolor(colorElement, {hash: true});
+
 	$('#theming .theme-undo').each(function() {
 		var setting = $(this).data('setting');
 		var value = $('#theming-'+setting).val();
diff --git a/apps/theming/templates/settings-admin.php b/apps/theming/templates/settings-admin.php
index 0cc224abc240dc1bf2ac2c4076b95331168edff3..656b23be4fb8a392609ab1d15119e7274eba8866 100644
--- a/apps/theming/templates/settings-admin.php
+++ b/apps/theming/templates/settings-admin.php
@@ -62,7 +62,7 @@ style('theming', 'settings-admin');
 	<div>
 		<label>
 			<span><?php p($l->t('Color')) ?></span>
-			<input id="theming-color" type="text" class="jscolor" data-jscolor="{hash:true}" maxlength="7" value="<?php p($_['color']) ?>" />
+			<input id="theming-color" type="text" maxlength="7" value="<?php p($_['color']) ?>" />
 			<div data-setting="color" data-toggle="tooltip" data-original-title="<?php p($l->t('Reset to default')); ?>" class="theme-undo icon icon-history"></div>
 		</label>
 	</div>