diff --git a/qlfile.lock b/qlfile.lock
index eb92043..21e1eca 100644
--- a/qlfile.lock
+++ b/qlfile.lock
@@ -17,7 +17,7 @@
 ("hsx" .
  (:class qlot/source/git:source-git
   :initargs (:remote-url "https://github.com/skyizwhite/hsx.git")
-  :version "git-7ce7751900ce6eacb9264b3109402bcc17aa40b2"))
+  :version "git-f60259ec4a101de87c5364c3f1b571706448d3a0"))
 ("ningle-fbr" .
  (:class qlot/source/git:source-git
   :initargs (:remote-url "https://github.com/skyizwhite/ningle-fbr.git")
diff --git a/src/components/footer.lisp b/src/components/footer.lisp
index 7edaf37..bac89ba 100644
--- a/src/components/footer.lisp
+++ b/src/components/footer.lisp
@@ -1,11 +1,11 @@
 (defpackage #:hp/components/footer
   (:use #:cl
        #:hsx)
-  (:export #:page-footer))
+  (:export #:~footer))
 (in-package #:hp/components/footer)
 
-(defcomp page-footer ()
+(defcomp ~footer ()
   (hsx
    (footer :class "fixed bottom-0 w-full"
      (div :class "container py-6 flex justify-end"
-       (p "© 2025 skyizwhite")))))
+       (p "© 2025 skyizwhite")))))
\ No newline at end of file
diff --git a/src/components/header.lisp b/src/components/header.lisp
index b002b16..7af6768 100644
--- a/src/components/header.lisp
+++ b/src/components/header.lisp
@@ -1,10 +1,10 @@
 (defpackage #:hp/components/header
   (:use #:cl
         #:hsx)
-  (:export #:page-header))
+  (:export #:~header))
 (in-package #:hp/components/header)
 
-(defcomp page-header ()
+(defcomp ~header ()
   (let ((links '(("Home" "/")
                  ("About" "/about")
                  ("Work" "/work")
@@ -20,7 +20,8 @@
                :class "w-52 h-auto")))
          (ul :class "flex flex-col gap-4"
            (loop
-             :for (content href) :in links :collect
-                (li :class "flex items-center"
-                  (a :href href :class "text-lg hover:text-orange-600"
-                    content)))))))))
+             :for (title href) :in links :collect
+                (hsx
+                 (li :class "flex items-center"
+                   (a :href href :class "text-lg hover:text-orange-600"
+                     title))))))))))
diff --git a/src/middlewares/recoverer.lisp b/src/middlewares/recoverer.lisp
index 31d60a5..3722d50 100644
--- a/src/middlewares/recoverer.lisp
+++ b/src/middlewares/recoverer.lisp
@@ -15,8 +15,9 @@
        (main
          (h1 "500 Internal Server Error")
          (when (env:dev-mode-p)
-           (pre
-             (code (tb:print-backtrace condition :output nil)))))))))
+           (hsx
+            (pre
+              (code (tb:print-backtrace condition :output nil))))))))))
 
 (defparameter *recoverer*
   (lambda (app)
diff --git a/src/renderer.lisp b/src/renderer.lisp
index 94802a5..47f740d 100644
--- a/src/renderer.lisp
+++ b/src/renderer.lisp
@@ -13,7 +13,7 @@
 (defun bust-cache (url)
   (format nil "~a?~a" url #.(get-universal-time)))
 
-(defcomp document (&key title description children)
+(defcomp ~document (&key title description children)
   (hsx
    (html :lang "ja"
      (head
@@ -34,18 +34,19 @@
          :name "description"
          :content
          (or description
-             (<>
-               "Welcome to the official website of 'Amongtellers (Amaterasu)', "
-               "a personal project by paku (skyizwhite). "
-               "Discover project details, the latest updates, and related activities."))))
+             (hsx
+              (<>
+                "Welcome to the official website of 'Amongtellers (Amaterasu)', "
+                "a personal project by paku (skyizwhite). "
+                "Discover project details, the latest updates, and related activities.")))))
      (body
        :hx-ext "head-support, response-targets"
        :hx-boost "true" :hx-target-404 "body" :hx-target-5* "body"
        :class "h-[100svh] flex flex-col"
-       (cmp:page-header)
+       (cmp:~header)
        (main :class "flex-1 h-full"
          children)
-       (cmp:page-footer)))))
+       (cmp:~footer)))))
 
 (defmethod jg:process-response ((app jg:app) result)
   (jg:set-response-header :content-type "text/html; charset=utf-8")
@@ -59,5 +60,5 @@
                        ((guard (or (list element metadata)
                                    element)
                                (typep element 'element))
-                        (document metadata element))
+                        (~document metadata element))
                        (_ (error "Invalid response form"))))))
diff --git a/src/routes/index.lisp b/src/routes/index.lisp
index 70aac37..95f7371 100644
--- a/src/routes/index.lisp
+++ b/src/routes/index.lisp
@@ -4,7 +4,7 @@
   (:export #:handle-get))
 (in-package #:hp/routes/index)
 
-(defcomp page ()
+(defcomp ~page ()
   (hsx
    (section
      ; first view
@@ -18,4 +18,4 @@
 
 (defun handle-get (params)
   (declare (ignore params))
-  (page))
+  (~page))
diff --git a/src/routes/not-found.lisp b/src/routes/not-found.lisp
index 0de2c11..97b0750 100644
--- a/src/routes/not-found.lisp
+++ b/src/routes/not-found.lisp
@@ -9,7 +9,7 @@
   '(:title "404 Not Found"
     :description "The page you are looking for may have been deleted or the URL might be incorrect."))
 
-(defcomp page ()
+(defcomp ~page ()
   (hsx
    (section :class "container flex flex-col justify-center items-center h-full gap-10"
      (h1 :class "text-2xl text-red-600"
@@ -20,4 +20,4 @@
 
 (defun handle-not-found ()
   (jg:set-response-status :not-found)
-  (list (page) *metadata*))
+  (list (~page) *metadata*))