{% if field.value matches '{^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$}' %}
<div style="background-color:{{ field.value }};width:12px;height:12px;border-radius:50%;box-shadow:0 0 0 1px rgba(0, 0, 0, .4)"></div>
{% else %}
{{ field.value|slice(0, 128)|striptags|raw }}
{% endif %}