diff --git a/package.json b/package.json
index 5432fb5..ed4d5ef 100644
--- a/package.json
+++ b/package.json
@@ -14,7 +14,8 @@
     "prism-react-renderer": "^2.4.0",
     "react": "^18",
     "react-dom": "^18",
-    "react-markdown": "^9.0.1"
+    "react-markdown": "^9.0.1",
+    "rehype-highlight": "^7.0.0"
   },
   "devDependencies": {
     "@types/node": "^20",
diff --git a/src/app/[...file]/components/content.tsx b/src/app/[...file]/components/content.tsx
index b2a2118..5c87652 100644
--- a/src/app/[...file]/components/content.tsx
+++ b/src/app/[...file]/components/content.tsx
@@ -34,7 +34,7 @@ function is_type(response: Response, type: ContentType<any>) {
 }
 
 export default function Content({ src }: { src: string}) {
-	const [content, set_content] = useState<React.ReactNode>();
+	const [content, set_content] = useState<JSX.Element>();
 
 	const recognized_types: ContentType<any>[] = [{
 		content_type: /image\/\w+/,
diff --git a/src/app/[...file]/components/copy.tsx b/src/app/[...file]/components/copy.tsx
deleted file mode 100644
index 3380184..0000000
--- a/src/app/[...file]/components/copy.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-'use client'
-
-import { useState } from 'react';
-
-import * as style from './copy.css';
-
-export default function Copy({ className, text, children }: { className?: string, text: string, children: React.ReactNode }) {
-	const [copied, set_copied ] = useState(false);
-	function make_copy_text(text: string) {
-		return () => {
-			navigator.clipboard.writeText(text);
-			set_copied(true);
-			setTimeout(() => { set_copied(false); }, 2000);
-		};
-	}
-	return <button onClick={make_copy_text(text)} className={`${style.copy} ${className ?? ''}`}>{copied ? '[ Copied ]' : '[  Copy  ]'} {children}</button>
-}
diff --git a/src/app/[...file]/components/copy.css.ts b/src/app/[...file]/components/download_tty.css.ts
similarity index 91%
rename from src/app/[...file]/components/copy.css.ts
rename to src/app/[...file]/components/download_tty.css.ts
index 06d1b71..c9a37c0 100644
--- a/src/app/[...file]/components/copy.css.ts
+++ b/src/app/[...file]/components/download_tty.css.ts
@@ -2,7 +2,7 @@ import { style } from '@vanilla-extract/css';
 
 import * as colors from '../../colors.css';
 
-export const copy = style({
+export const download_tty = style({
 	display:    'block',
 	margin:     0,
 	border:     'none',
diff --git a/src/app/[...file]/components/download_tty.tsx b/src/app/[...file]/components/download_tty.tsx
new file mode 100644
index 0000000..80a4a53
--- /dev/null
+++ b/src/app/[...file]/components/download_tty.tsx
@@ -0,0 +1,17 @@
+'use client'
+
+// import { useState } from 'react';
+
+import * as style from './download_tty.css';
+
+export default function DownloadTTY({ text }: { text: string }) {
+	// const [copied, set_copied] = useState(false);
+	function make_copy_text(text: string) {
+		return () => {
+			navigator.clipboard.writeText(text);
+			// set_copied(true);
+			// setTimeout(() => { set_copied(false); }, 5000);
+		};
+	}
+	return <button onClick={make_copy_text(text)} className={style.download_tty}>{text}</button>;
+}
diff --git a/src/app/[...file]/components/types/markdown.css.ts b/src/app/[...file]/components/types/markdown.css.ts
index d010ed8..1bef7a5 100644
--- a/src/app/[...file]/components/types/markdown.css.ts
+++ b/src/app/[...file]/components/types/markdown.css.ts
@@ -14,4 +14,20 @@ export const code_bounds = style({
 export const copy = style({
 	position:   'absolute',
 	right:      0,
+	display:    'block',
+	margin:     0,
+	border:     'none',
+	padding:    '0',
+	outline:    'inherit',
+	fontFamily: 'monospace',
+	fontSize:   '1.1em',
+	lineHeight: '2em',
+	background: 'none',
+	color:      'inherit',
+	transition: 'color 0.15s',
+	whiteSpace: 'pre-wrap',
+	':hover': {
+		color: colors.accent,
+	},
+
 });
diff --git a/src/app/[...file]/components/types/markdown.tsx b/src/app/[...file]/components/types/markdown.tsx
index b9c52c1..5eb67ad 100644
--- a/src/app/[...file]/components/types/markdown.tsx
+++ b/src/app/[...file]/components/types/markdown.tsx
@@ -1,7 +1,6 @@
 import Markdown from 'react-markdown';
 
 import * as style from './markdown.css';
-import Copy from '../copy';
 import Text from './text';
 import { map_to_type } from './text';
 
@@ -13,7 +12,7 @@ export default function MarkdownContent({ text }: { text: string }) {
 					const split = props.className.split('-');
 					return (
 						<div className={style.code_bounds}>
-							<Copy className={style.copy} text={props.children}></Copy>
+							<button onClick={() => { navigator.clipboard.writeText(props.children); }} className={style.copy}>[ Copy ]</button>
 							<Text language={split.length == 0 ? 'none' : map_to_type(split[split.length - 1])} text={props.children} line_numbers={false} />
 						</div>
 					);
diff --git a/src/app/[...file]/page.tsx b/src/app/[...file]/page.tsx
index 48c955f..c31e54d 100644
--- a/src/app/[...file]/page.tsx
+++ b/src/app/[...file]/page.tsx
@@ -1,9 +1,9 @@
 import type { Metadata } from 'next';
 import Image from 'next/image';
 
-import * as style from './page.css';
+import DownloadTTY from './components/download_tty';
 import Content from './components/content';
-import Copy from './components/copy';
+import * as style from './page.css';
 import download_image_dark from './download_dark.svg';
 import download_image_light from './download_light.svg';
 
@@ -66,7 +66,7 @@ export default async function Page({
 					</button>
 				</div>
 				<div className={style.download_tty_group}>
-					{download_ttys.map((text, index) => <Copy key={index} text={text}>{text}</Copy>)}
+					{download_ttys.map((text, index) => <DownloadTTY key={index} text={text} />)}
 				</div>
 				<Content src={`${root}${path}`} />
 			</div>