only render route colours if the value is a valid color

addresses https://github.com/openstreetmap/iD/pull/9424#discussion_r1046495633

modules/ui/fields/input.js

@@ -9,6 +9,7 @@ import { t, localizer } from '../../core/localizer';
 import { utilDetect, utilGetSetValue, utilNoAuto, utilRebind, utilTotalExtent } from '../../util';
 import { svgIcon } from '../../svg/icon';
 import { cardinal } from '../../osm/node';
+import { isColourValid } from '../../osm/tags';
 import { uiLengthIndicator } from '..';
 import { uiTooltip } from '../tooltip';
 import { isEqual } from 'lodash-es';
@@ -228,16 +229,6 @@ export function uiFieldText(field, context) {
 
 
     function updateColourPreview() {
-        function isColourValid(colour) {
-            if (!colour.match(/^(#([0-9a-fA-F]{3}){1,2}|\w+)$/)) {
-                // OSM only supports hex or named colors
-                return false;
-            } else if (!CSS.supports('color', colour) || ['unset', 'inherit', 'initial', 'revert'].includes(colour)) {
-                // see https://stackoverflow.com/a/68217760/1627467
-                return false;
-            }
-            return true;
-        }
         wrap.selectAll('.colour-preview')
             .remove();