diff --git a/blog.janet b/blog.janet
index afe4502..6ff4a12 100644
--- a/blog.janet
+++ b/blog.janet
@@ -1,5 +1,8 @@
 #!/usr/bin/env janet
 
+(import ./grammar/php :as php)
+(import ./grammar/janet :as janet)
+
 (defn read-from-file [file-path]
   "Read a file from string filepath"
   (let [f (file/open file-path :r)
@@ -7,6 +10,14 @@
     (file/close f)
     content))
 
+(defn write-to-file [file-path content]
+  "Append to file from string filepath"
+  (let [f (file/open file-path :w)]
+    (file/write f content)
+    (file/flush f)
+    (file/close f)
+    content))
+
 (defn htmlspecialchars
   "Convert html special chars from a string"
   [value]
@@ -62,10 +73,26 @@
 
         :main (some (* :block (? :end-of-line)))})
 
+(defn code-ast-to-html
+  [ast]
+    (string/join
+      (map
+        |(match $0
+            [:single-line-comment value] (string "<span class=\"highlighted-comment\">" (htmlspecialchars value) "</span>")
+            [:multi-line-comment value] (string "<span class=\"highlighted-comment\">" (htmlspecialchars value) "</span>")
+            [:string value] (string "<span class=\"highlighted-string\">" (htmlspecialchars value) "</span>")
+            [:variable value] (string "<span class=\"highlighted-variable\">" (htmlspecialchars value) "</span>")
+            [:return-type value] (string "<span class=\"highlighted-variable\">" (htmlspecialchars value) "</span>")
+            [:keyword value] (string "<span class=\"highlighted-keyword\">" (htmlspecialchars value) "</span>")
+            [:other value] (htmlspecialchars value)
+            _ (error (string "Invalid symbol: " (get $0 0))))
+          ast)
+        ""))
+
 (defn ast-to-html
   "Convert an AST to html"
   [ast]
-    (defn to-codeblock [lang value] (string "<pre class=\"my-4\"><code>" (htmlspecialchars value) "</code></pre>"))
+    (defn to-codeblock [lang value] (string "<pre class=\"my-4 p-4 highlighted-base\"><code>" (code-ast-to-html (peg/match (eval-string (string lang "/to-ast")) value)) "</code></pre>"))
     (defn to-codeline [value] (string "<code>" (ast-to-html value) "</code>"))
     (defn to-heading [level value] (string "<h" level " class=\"my-4\">" (htmlspecialchars value) "</h" level ">"))
     (defn to-quote [value] (string "<blockquote class=\"my-4\">" (ast-to-html value) "</blockquote>"))
@@ -102,7 +129,8 @@
       (print "]"))))
 
 (defn main [bin & args]
-  # (pp-ast (peg/match md-to-ast (read-from-file "raw/~blog/blog.md")))
-  (print (read-from-file "partial-template/header.html"))
-  (print (ast-to-html (peg/match md-to-ast (read-from-file "raw/~blog/blog.md"))))
-  (print (read-from-file "partial-template/footer.html")))
+  (pp-ast (peg/match md-to-ast (read-from-file "raw/~blog/blog.md")))
+  (write-to-file "test4.html" (string 
+    (read-from-file "partial-template/header.html")
+    (ast-to-html (peg/match md-to-ast (read-from-file "raw/~blog/blog.md")))
+    (read-from-file "partial-template/footer.html"))))
diff --git a/grammar/php.janet b/grammar/php.janet
index 874c6ae..bc15029 100644
--- a/grammar/php.janet
+++ b/grammar/php.janet
@@ -1,43 +1,6 @@
 #!/usr/bin/env janet
 
-# need to get comment, link, doctag, string literal/regexp, other literal, keyword  identifier?
-# based on https://github.com/php/php-langspec/blob/ca697b43031efd70b5306d29b74e1190e7eacac8/spec/19-grammar.md
-
-(defn read-from-file [file-path]
-  "Read a file from string filepath"
-  (let [f (file/open file-path :r)
-        content  (file/read f :all)]
-    (file/close f)
-    content))
-
-(defn write-to-file [file-path content]
-  "Append to file from string filepath"
-  (let [f (file/open file-path :w)]
-    (file/write f content)
-    (file/flush f)
-    (file/close f)
-    content))
-
-
-(defn pp-ast
-  "Pretty prints the PHP AST (as provided by (peg/match php-to-ast))"
-  [ast]
-  (if ast
-    (do
-      (print "[")
-      (map |(printf "\t%q" $0) ast)
-      (print "]"))))
-
-(defn htmlspecialchars
-  "Convert html special chars from a string"
-  [value]
-    (string/replace-all "\"" "&quot;"
-      (string/replace-all "'" "&apos;"
-        (string/replace-all "<" "&lt;" 
-          (string/replace-all ">" "&gt;"
-            (string/replace-all "&" "&amp;" value))))))
-
-(def php-to-ast
+(def to-ast
   "A custom markdown flavored grammar"
     ~{
         :end-of-line (* (? "\r") "\n")
@@ -68,24 +31,3 @@
         :other (cmt (<- (if-not :comment 1)),|[:other (string/join $&)])
 
         :main (some (+ :comment :string :variable :return-type :keyword :other))})
-
-(defn ast-to-html
-  [ast]
-    (string/join
-      (map
-        |(match $0
-            [:single-line-comment value] (string "<span style=\"color:#a0a1a7;font-style:italic\">" (htmlspecialchars value) "</span>")
-            [:multi-line-comment value] (string "<span style=\"color:#a0a1a7;font-style:italic\">" (htmlspecialchars value) "</span>")
-            [:string value] (string "<span style=\"color:#50a14f\">" (htmlspecialchars value) "</span>")
-            [:variable value] (string "<span style=\"color:#986801\">" (htmlspecialchars value) "</span>")
-            [:return-type value] (string "<span style=\"color:#216ce7\">" (htmlspecialchars value) "</span>")
-            [:keyword value] (string "<span style=\"color:#a626a4\">" (htmlspecialchars value) "</span>")
-            [:other value] (htmlspecialchars value)
-            _ (error (string "Invalid symbol: " (get $0 0))))
-          ast)
-        ""))
-
-
-(defn main [bin & args]
-    # (pp-ast (peg/match php-to-ast (read-from-file "sample.php"))))
-    (write-to-file "php.html" (string "<pre><code>" (ast-to-html (peg/match php-to-ast (read-from-file "sample.php"))) "</code></pre>")))
diff --git a/partial-template/header.html b/partial-template/header.html
index 68463eb..662f3ea 100644
--- a/partial-template/header.html
+++ b/partial-template/header.html
@@ -8,6 +8,7 @@
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@400&display=swap" rel="stylesheet">
+    <link href="public/highlight-style.css" rel="stylesheet">
     <script src="https://cdn.tailwindcss.com/3.3.7"></script>
     <script>
         tailwind.config = {
@@ -34,4 +35,4 @@
             <span class="after:content-[''] after:w-[1px] after:bg-black after:my-2 after:h-4/5 after:block"></span>
         </div>
     </nav>
-    <main class="my-8 ml-24 mr-[38rem]">
+    <main class="my-8 ml-24 mr-[38rem] w-[100%] p-4">
diff --git a/public/highlight-style.css b/public/highlight-style.css
new file mode 100644
index 0000000..3b667e7
--- /dev/null
+++ b/public/highlight-style.css
@@ -0,0 +1,92 @@
+/*
+
+Original One Light Syntax theme from https://github.com/atom/one-light-syntax
+
+base:    #fafafa
+mono-1:  #383a42
+mono-2:  #686b77
+mono-3:  #a0a1a7
+hue-1:   #0184bb
+hue-2:   #4078f2
+hue-3:   #a626a4
+hue-4:   #50a14f
+hue-5:   #e45649
+hue-5-2: #c91243
+hue-6:   #986801
+hue-6-2: #c18401
+
+*/
+
+.highlighted-base {
+    background-color: #fafafa;
+}
+
+.highlighted-comment,
+.highlighted-quote {
+    color: #a0a1a7;
+    font-style: italic;
+}
+
+.highlighted-doctag,
+.highlighted-keyword,
+.highlighted-formula {
+    color: #a626a4;
+}
+
+.highlighted-section,
+.highlighted-name,
+.highlighted-selector-tag,
+.highlighted-deletion,
+.highlighted-subst {
+    color: #e45649;
+}
+
+.highlighted-literal {
+    color: #0184bb;
+}
+
+.highlighted-string,
+.highlighted-regexp,
+.highlighted-addition,
+.highlighted-attribute,
+.highlighted-meta .highlighted-string {
+    color: #50a14f;
+}
+
+.highlighted-attr,
+.highlighted-variable,
+.highlighted-template-variable,
+.highlighted-type,
+.highlighted-selector-class,
+.highlighted-selector-attr,
+.highlighted-selector-pseudo,
+.highlighted-number {
+    color: #986801;
+}
+
+.highlighted-symbol,
+.highlighted-bullet,
+.highlighted-link,
+.highlighted-meta,
+.highlighted-selector-id,
+.highlighted-title {
+    color: #4078f2;
+}
+
+.highlighted-built_in,
+.highlighted-title,
+.highlighted-class .highlighted-title {
+    color: #c18401;
+}
+
+.highlighted-emphasis {
+    font-style: italic;
+}
+
+.highlighted-strong {
+    font-weight: bold;
+}
+
+.highlighted-link {
+    text-decoration: underline;
+}
\ No newline at end of file