diff --git a/src/core/plugins/json-schema-2020-12/components/JSONSchema/JSONSchema.jsx b/src/core/plugins/json-schema-2020-12/components/JSONSchema/JSONSchema.jsx
index a4fe47fc165..bad1399e10e 100644
--- a/src/core/plugins/json-schema-2020-12/components/JSONSchema/JSONSchema.jsx
+++ b/src/core/plugins/json-schema-2020-12/components/JSONSchema/JSONSchema.jsx
@@ -37,6 +37,7 @@ const JSONSchema = ({ schema, name }) => {
   const Keyword$id = useComponent("Keyword$id")
   const Keyword$anchor = useComponent("Keyword$anchor")
   const Keyword$dynamicAnchor = useComponent("Keyword$dynamicAnchor")
+  const Keyword$ref = useComponent("Keyword$ref")
   const KeywordProperties = useComponent("KeywordProperties")
   const KeywordType = useComponent("KeywordType")
   const KeywordFormat = useComponent("KeywordFormat")
@@ -105,6 +106,7 @@ const JSONSchema = ({ schema, name }) => {
                 <Keyword$id schema={schema} />
                 <Keyword$anchor schema={schema} />
                 <Keyword$dynamicAnchor schema={schema} />
+                <Keyword$ref schema={schema} />
               </div>
             )}
           </article>
diff --git a/src/core/plugins/json-schema-2020-12/components/keywords/$ref.jsx b/src/core/plugins/json-schema-2020-12/components/keywords/$ref.jsx
new file mode 100644
index 00000000000..5971a5a50de
--- /dev/null
+++ b/src/core/plugins/json-schema-2020-12/components/keywords/$ref.jsx
@@ -0,0 +1,25 @@
+/**
+ * @prettier
+ */
+import React from "react"
+
+import { schema } from "../../prop-types"
+
+const $ref = ({ schema }) => {
+  if (!schema?.$ref) return null
+
+  return (
+    <div className="json-schema-2020-12__$ref">
+      <span className="json-schema-2020-12-core-keyword">$ref</span>
+      <span className="json-schema-2020-12-core-keyword__value">
+        {schema.$ref}
+      </span>
+    </div>
+  )
+}
+
+$ref.propTypes = {
+  schema: schema.isRequired,
+}
+
+export default $ref
diff --git a/src/core/plugins/json-schema-2020-12/fn.js b/src/core/plugins/json-schema-2020-12/fn.js
index 894d9990f2e..f23469e7276 100644
--- a/src/core/plugins/json-schema-2020-12/fn.js
+++ b/src/core/plugins/json-schema-2020-12/fn.js
@@ -118,6 +118,7 @@ export const isExpandable = (schema) => {
     schema?.$id ||
     schema?.$anchor ||
     schema?.$dynamicAnchor ||
+    schema?.$ref ||
     schema?.description ||
     schema?.properties
   )
diff --git a/src/core/plugins/json-schema-2020-12/hoc.jsx b/src/core/plugins/json-schema-2020-12/hoc.jsx
index 61b194e88aa..7b729ce45cf 100644
--- a/src/core/plugins/json-schema-2020-12/hoc.jsx
+++ b/src/core/plugins/json-schema-2020-12/hoc.jsx
@@ -9,6 +9,7 @@ import Keyword$vocabulary from "./components/keywords/$vocabulary/$vocabulary"
 import Keyword$id from "./components/keywords/$id"
 import Keyword$anchor from "./components/keywords/$anchor"
 import Keyword$dynamicAnchor from "./components/keywords/$dynamicAnchor"
+import Keyword$ref from "./components/keywords/$ref"
 import KeywordProperties from "./components/keywords/Properties"
 import KeywordType from "./components/keywords/Type/Type"
 import KeywordFormat from "./components/keywords/Format/Format"
@@ -35,6 +36,7 @@ export const withJSONSchemaContext = (Component, overrides = {}) => {
       Keyword$id,
       Keyword$anchor,
       Keyword$dynamicAnchor,
+      Keyword$ref,
       KeywordProperties,
       KeywordType,
       KeywordFormat,
diff --git a/src/core/plugins/json-schema-2020-12/index.js b/src/core/plugins/json-schema-2020-12/index.js
index d03441b0634..40e7a9b0f19 100644
--- a/src/core/plugins/json-schema-2020-12/index.js
+++ b/src/core/plugins/json-schema-2020-12/index.js
@@ -8,6 +8,7 @@ import Keyword$vocabulary from "./components/keywords/$vocabulary/$vocabulary"
 import Keyword$id from "./components/keywords/$id"
 import Keyword$anchor from "./components/keywords/$anchor"
 import Keyword$dynamicAnchor from "./components/keywords/$dynamicAnchor"
+import Keyword$ref from "./components/keywords/$ref"
 import KeywordType from "./components/keywords/Type/Type"
 import KeywordFormat from "./components/keywords/Format/Format"
 import KeywordTitle from "./components/keywords/Title/Title"
@@ -26,6 +27,7 @@ const JSONSchema202012Plugin = () => ({
     JSONSchema202012Keyword$id: Keyword$id,
     JSONSchema202012Keyword$anchor: Keyword$anchor,
     JSONSchema202012Keyword$dynamicAnchor: Keyword$dynamicAnchor,
+    JSONSchema202012Keyword$ref: Keyword$ref,
     JSONSchema202012KeywordProperties: KeywordProperties,
     JSONSchema202012KeywordType: KeywordType,
     JSONSchema202012KeywordFormat: KeywordFormat,
diff --git a/src/core/plugins/oas31/wrap-components/models.jsx b/src/core/plugins/oas31/wrap-components/models.jsx
index cf4c558569c..b20a63abba4 100644
--- a/src/core/plugins/oas31/wrap-components/models.jsx
+++ b/src/core/plugins/oas31/wrap-components/models.jsx
@@ -16,6 +16,7 @@ const ModelsWrapper = createOnlyOAS31ComponentWrapper(({ getSystem }) => {
   const Keyword$dynamicAnchor = getComponent(
     "JSONSchema202012Keyword$dynamicAnchor"
   )
+  const Keyword$ref = getComponent("JSONSchema202012Keyword$ref")
   const KeywordProperties = getComponent("JSONSchema202012KeywordProperties")
   const KeywordType = getComponent("JSONSchema202012KeywordType")
   const KeywordFormat = getComponent("JSONSchema202012KeywordFormat")
@@ -40,6 +41,7 @@ const ModelsWrapper = createOnlyOAS31ComponentWrapper(({ getSystem }) => {
       Keyword$id,
       Keyword$anchor,
       Keyword$dynamicAnchor,
+      Keyword$ref,
       KeywordProperties,
       KeywordType,
       KeywordFormat,