diff --git a/backend/types/view_type.go b/backend/types/view_type.go
index 161aead..9519293 100644
--- a/backend/types/view_type.go
+++ b/backend/types/view_type.go
@@ -2,6 +2,7 @@ package types
 
 const FORMAT_RAW = "Raw"
 const FORMAT_JSON = "JSON"
+const FORMAT_UNICODE_JSON = "Unicode JSON"
 const FORMAT_YAML = "YAML"
 const FORMAT_XML = "XML"
 const FORMAT_HEX = "Hex"
diff --git a/backend/utils/convert/convert.go b/backend/utils/convert/convert.go
index c713d3a..e821a8e 100644
--- a/backend/utils/convert/convert.go
+++ b/backend/utils/convert/convert.go
@@ -15,6 +15,7 @@ type DataConvert interface {
 
 var (
 	jsonConv    JsonConvert
+	uniJsonConv UnicodeJsonConvert
 	yamlConv    YamlConvert
 	xmlConv     XmlConvert
 	base64Conv  Base64Convert
@@ -30,11 +31,12 @@ var (
 )
 
 var BuildInFormatters = map[string]DataConvert{
-	types.FORMAT_JSON:   jsonConv,
-	types.FORMAT_YAML:   yamlConv,
-	types.FORMAT_XML:    xmlConv,
-	types.FORMAT_HEX:    hexConv,
-	types.FORMAT_BINARY: binaryConv,
+	types.FORMAT_JSON:         jsonConv,
+	types.FORMAT_UNICODE_JSON: uniJsonConv,
+	types.FORMAT_YAML:         yamlConv,
+	types.FORMAT_XML:          xmlConv,
+	types.FORMAT_HEX:          hexConv,
+	types.FORMAT_BINARY:       binaryConv,
 }
 
 var BuildInDecoders = map[string]DataConvert{
diff --git a/backend/utils/convert/unicode_json_convert.go b/backend/utils/convert/unicode_json_convert.go
new file mode 100644
index 0000000..2ebc313
--- /dev/null
+++ b/backend/utils/convert/unicode_json_convert.go
@@ -0,0 +1,43 @@
+package convutil
+
+import (
+	"bytes"
+	"encoding/json"
+	"strings"
+)
+
+type UnicodeJsonConvert struct{}
+
+func (UnicodeJsonConvert) Enable() bool {
+	return true
+}
+
+func (UnicodeJsonConvert) Decode(str string) (string, bool) {
+	trimedStr := strings.TrimSpace(str)
+	if strings.HasPrefix(trimedStr, "{") && strings.HasSuffix(trimedStr, "}") {
+		var obj map[string]any
+		if err := json.Unmarshal([]byte(trimedStr), &obj); err == nil {
+			var out []byte
+			if out, err = json.MarshalIndent(obj, "", " "); err == nil {
+				return string(out), true
+			}
+		}
+	} else if strings.HasPrefix(trimedStr, "[") && strings.HasSuffix(trimedStr, "]") {
+		var arr []any
+		if err := json.Unmarshal([]byte(trimedStr), &arr); err == nil {
+			var out []byte
+			if out, err = json.MarshalIndent(arr, "", " "); err == nil {
+				return string(out), true
+			}
+		}
+	}
+	return str, false
+}
+
+func (UnicodeJsonConvert) Encode(str string) (string, bool) {
+	var dst bytes.Buffer
+	if err := json.Compact(&dst, []byte(str)); err != nil {
+		return str, false
+	}
+	return dst.String(), true
+}
diff --git a/frontend/src/components/content_value/ContentEntryEditor.vue b/frontend/src/components/content_value/ContentEntryEditor.vue
index 6989d6a..452df28 100644
--- a/frontend/src/components/content_value/ContentEntryEditor.vue
+++ b/frontend/src/components/content_value/ContentEntryEditor.vue
@@ -94,6 +94,7 @@ const enableSave = computed(() => {
 const viewLanguage = computed(() => {
     switch (viewAs.format) {
         case formatTypes.JSON:
+        case formatTypes.UNICODE_JSON:
             return 'json'
         case formatTypes.YAML:
             return 'yaml'
diff --git a/frontend/src/components/content_value/ContentValueHash.vue b/frontend/src/components/content_value/ContentValueHash.vue
index 600cf3c..93d805d 100644
--- a/frontend/src/components/content_value/ContentValueHash.vue
+++ b/frontend/src/components/content_value/ContentValueHash.vue
@@ -107,17 +107,17 @@ const fieldColumn = computed(() => ({
     },
 }))
 
-const displayCode = computed(() => {
-    return props.format === formatTypes.JSON
+const isCode = computed(() => {
+    return props.format === formatTypes.JSON || props.format === formatTypes.UNICODE_JSON
 })
 // const valueFilterOption = ref(null)
 const valueColumn = computed(() => ({
     key: 'value',
     title: () => i18n.t('common.value'),
-    align: displayCode.value ? 'left' : 'center',
+    align: isCode.value ? 'left' : 'center',
     titleAlign: 'center',
     resizable: true,
-    ellipsis: displayCode.value
+    ellipsis: isCode.value
         ? false
         : {
               tooltip: {
@@ -137,7 +137,7 @@ const valueColumn = computed(() => ({
     //     return !!~row.v.indexOf(value.toString())
     // },
     render: (row) => {
-        if (displayCode.value) {
+        if (isCode.value) {
             return h('pre', {}, row.dv || row.v)
         }
         return row.dv || row.v
diff --git a/frontend/src/components/content_value/ContentValueList.vue b/frontend/src/components/content_value/ContentValueList.vue
index cc32302..297e631 100644
--- a/frontend/src/components/content_value/ContentValueList.vue
+++ b/frontend/src/components/content_value/ContentValueList.vue
@@ -77,16 +77,16 @@ const inEdit = computed(() => {
 })
 const fullEdit = ref(false)
 
-const displayCode = computed(() => {
-    return props.format === formatTypes.JSON
+const isCode = computed(() => {
+    return props.format === formatTypes.JSON || props.format === formatTypes.UNICODE_JSON
 })
 const valueFilterOption = ref(null)
 const valueColumn = computed(() => ({
     key: 'value',
     title: () => i18n.t('common.value'),
-    align: displayCode.value ? 'left' : 'center',
+    align: isCode.value ? 'left' : 'center',
     titleAlign: 'center',
-    ellipsis: displayCode.value
+    ellipsis: isCode.value
         ? false
         : {
               tooltip: {
@@ -106,7 +106,7 @@ const valueColumn = computed(() => ({
         return !!~row.v.indexOf(value.toString())
     },
     render: (row) => {
-        if (displayCode.value) {
+        if (isCode.value) {
             return h('pre', {}, row.dv || row.v)
         }
         return row.dv || row.v
diff --git a/frontend/src/components/content_value/ContentValueSet.vue b/frontend/src/components/content_value/ContentValueSet.vue
index 8c4d613..ea44b3c 100644
--- a/frontend/src/components/content_value/ContentValueSet.vue
+++ b/frontend/src/components/content_value/ContentValueSet.vue
@@ -76,16 +76,16 @@ const inEdit = computed(() => {
 })
 const fullEdit = ref(false)
 
-const displayCode = computed(() => {
-    return props.format === formatTypes.JSON
+const isCode = computed(() => {
+    return props.format === formatTypes.JSON || props.format === formatTypes.UNICODE_JSON
 })
 const valueFilterOption = ref(null)
 const valueColumn = computed(() => ({
     key: 'value',
     title: () => i18n.t('common.value'),
-    align: displayCode.value ? 'left' : 'center',
+    align: isCode.value ? 'left' : 'center',
     titleAlign: 'center',
-    ellipsis: displayCode.value
+    ellipsis: isCode.value
         ? false
         : {
               tooltip: {
@@ -105,7 +105,7 @@ const valueColumn = computed(() => ({
         return !!~row.v.indexOf(value.toString())
     },
     render: (row) => {
-        if (displayCode.value) {
+        if (isCode.value) {
             return h('pre', {}, row.dv || row.v)
         }
         return row.dv || row.v
diff --git a/frontend/src/components/content_value/ContentValueString.vue b/frontend/src/components/content_value/ContentValueString.vue
index 8ded850..c023b87 100644
--- a/frontend/src/components/content_value/ContentValueString.vue
+++ b/frontend/src/components/content_value/ContentValueString.vue
@@ -47,6 +47,7 @@ const keyType = redisTypes.STRING
 const viewLanguage = computed(() => {
     switch (viewAs.format) {
         case formatTypes.JSON:
+        case formatTypes.UNICODE_JSON:
             return 'json'
         case formatTypes.YAML:
             return 'yaml'
diff --git a/frontend/src/components/content_value/ContentValueZSet.vue b/frontend/src/components/content_value/ContentValueZSet.vue
index 04a77b7..6bc6833 100644
--- a/frontend/src/components/content_value/ContentValueZSet.vue
+++ b/frontend/src/components/content_value/ContentValueZSet.vue
@@ -124,17 +124,17 @@ const scoreColumn = computed(() => ({
     },
 }))
 
-const displayCode = computed(() => {
-    return props.format === formatTypes.JSON
+const isCode = computed(() => {
+    return props.format === formatTypes.JSON || props.format === formatTypes.UNICODE_JSON
 })
 const valueFilterOption = ref(null)
 const valueColumn = computed(() => ({
     key: 'value',
     title: () => i18n.t('common.value'),
-    align: displayCode.value ? 'left' : 'center',
+    align: isCode.value ? 'left' : 'center',
     titleAlign: 'center',
     resizable: true,
-    ellipsis: displayCode.value
+    ellipsis: isCode.value
         ? false
         : {
               tooltip: {
@@ -155,7 +155,7 @@ const valueColumn = computed(() => ({
     },
     // sorter: (row1, row2) => row1.value - row2.value,
     render: (row) => {
-        if (displayCode.value) {
+        if (isCode.value) {
             return h('pre', {}, row.dv || row.v)
         }
         return row.dv || row.v
diff --git a/frontend/src/consts/value_view_type.js b/frontend/src/consts/value_view_type.js
index dc9a9ad..b2071bc 100644
--- a/frontend/src/consts/value_view_type.js
+++ b/frontend/src/consts/value_view_type.js
@@ -5,6 +5,7 @@
 export const formatTypes = {
     RAW: 'Raw',
     JSON: 'JSON',
+    UNICODE_JSON: 'Unicode JSON',
     YAML: 'YAML',
     XML: 'XML',
     HEX: 'Hex',