diff --git a/src/app/(pages)/[id]/page.tsx b/src/app/(pages)/[id]/page.tsx
index 034ac26..1cb9d2c 100644
--- a/src/app/(pages)/[id]/page.tsx
+++ b/src/app/(pages)/[id]/page.tsx
@@ -3,7 +3,7 @@ import { ActionMenu } from "@/app/components/action-menu";
 import { Metadata } from "next";
 import moment from "moment";
 import { notFound } from "next/navigation";
-import { CodeBlock } from "@/app/components/codeBlock";
+import { CodeBlock } from "@/app/components/code-block";
 import { detectLanguage } from "@/app/common/lang-detection/detection";
 
 type PasteProps = {
@@ -61,7 +61,7 @@ export async function generateMetadata({
   }
 
   return {
-    title: `Paste - ${id}`,
+    title: `Paste - ${id}.${data.language}`,
     description: `Created: ${moment(data.created)}\n\nClick to view the paste.`,
   };
 }
@@ -83,7 +83,7 @@ export default async function Paste({
       </div>
 
       <div className="p-1 hljs !bg-transparent text-sm">
-        <CodeBlock code={data.content} />
+        <CodeBlock code={data.content} language={data.language} />
       </div>
     </div>
   );
diff --git a/src/app/components/codeBlock.tsx b/src/app/components/code-block.tsx
similarity index 80%
rename from src/app/components/codeBlock.tsx
rename to src/app/components/code-block.tsx
index 30fb468..931a689 100644
--- a/src/app/components/codeBlock.tsx
+++ b/src/app/components/code-block.tsx
@@ -8,13 +8,19 @@ type CodeBlockProps = {
    * The code to highlight.
    */
   code: string;
+
+  /**
+   * The language of the code.
+   */
+  language: string;
 };
 
-export function CodeBlock({ code }: CodeBlockProps): ReactElement {
+export function CodeBlock({ code, language }: CodeBlockProps): ReactElement {
   return (
     <SyntaxHighlighter
       className="!bg-transparent text-xs"
       style={atomOneDark}
+      language={language}
       showLineNumbers
       codeTagProps={{
         style: {