diff --git a/docs/vercel/src/Index.svelte b/docs/vercel/src/Index.svelte
index 6ed42c9b4..e928b8e89 100644
--- a/docs/vercel/src/Index.svelte
+++ b/docs/vercel/src/Index.svelte
@@ -10,11 +10,12 @@
   let showMenu: boolean;
 
   const languages: Language[] = Object.entries(data as Languages).map(
-    ([name, { type, ascii, colors }]) => ({
+    ([name, { type, ascii, colors, icon }]) => ({
       name,
       type,
       ascii,
       colors,
+      icon,
     })
   );
 
@@ -30,6 +31,15 @@
     return languages.filter(({ type }) => $filter.checkboxes.includes(type));
   });
 
+  function escapeToUnicode(unicodeEscape: string): string {
+    if (unicodeEscape) {
+      let codePoint = parseInt(unicodeEscape.slice(3, -1), 16); // extract the relevent portion of the escape
+      return String.fromCodePoint(codePoint);
+    } else {
+      return '\u{25CF}';
+    }
+  }
+
   onMount(async () => {
     const response = await fetch(
       'https://api.github.com/repos/o2sh/onefetch/releases/latest'
@@ -102,7 +112,8 @@
       ansi={language.colors.ansi}
       hex={language.colors.hex}
       ascii={language.ascii}
-      chip={language.colors.chip} />
+      chip={language.colors.chip}
+      nerdfont={escapeToUnicode(language.icon)} />
   {/each}
 </main>
 
diff --git a/docs/vercel/src/components/AsciiPreview.svelte b/docs/vercel/src/components/AsciiPreview.svelte
index 8f9c236ed..e9d06cdb0 100644
--- a/docs/vercel/src/components/AsciiPreview.svelte
+++ b/docs/vercel/src/components/AsciiPreview.svelte
@@ -8,6 +8,7 @@
   export let hex: string[] | null = null;
   export let chip: string;
   export let ascii: string = '';
+  export let nerdfont: string;
 
   let dark = true;
   let trueColor = hex != null;
@@ -34,6 +35,7 @@
   <div class="language-name">
     <Chip id={name} color={chip} width={24} height={24} />
     <TitleLink {name} />
+    <h3 class="nerd-font">{nerdfont}</h3>
   </div>
   <div class="checkbox">
     <input id="dark-checkbox-{name}" type="checkbox" bind:checked={dark} />
@@ -54,6 +56,8 @@
 </div>
 
 <style>
+  @import url('https://www.nerdfonts.com/assets/css/webfont.css');
+
   .logo-container {
     display: flex;
     justify-content: center;
diff --git a/docs/vercel/src/yaml.d.ts b/docs/vercel/src/yaml.d.ts
index f9e7d7c57..9a8dc342c 100644
--- a/docs/vercel/src/yaml.d.ts
+++ b/docs/vercel/src/yaml.d.ts
@@ -10,6 +10,7 @@ declare module '*/languages.yaml' {
     type: string;
     ascii: string;
     colors: LanguageColors;
+    icon: string | null;
   }
 
   export type Languages = Record<string, Language>;