サイトをターミナルグリッドUIにリデザイン
·hidekingerz·[site update]
ターミナルグリッドUIへリデザイン
サイト全体を、Warp / Wezterm のようなモダンターミナルの視覚言語に寄せた Terminal Grid デザインへ全面リデザインしました。
主な変更
- TerminalChrome — タイトルバー(信号機ドット)+ Warp風タブを全ページ共通のシェルに
- About (
/) —whoami/neofetch --profileのタイピング演出とASCIIアート + KVテーブル - Portfolio (
/portfolio) — tmuxペイン風の2カラム(リスト + READMEプレビュー)。j/k/↑/↓で選択、Enterで公開URLを開けます - Posts (
/posts) —git log --oneline風の一覧 - Command Palette (⌘K) — ページ遷移・テーマ切替・外部リンクをキーボードから実行
スタック
既存の Next.js 16 (App Router) + TypeScript + Tailwind CSS 4 の構成を維持しつつ、 配色とタイポグラフィを刷新しています。
- Font: JetBrains Mono (UI) + Inter / Noto Sans JP (見出し・本文)
- Palette: GitHub greenを基調にamber / blueを効かせたダークターミナル配色
試してみてください
⌘K(またはCtrl + K) でコマンドパレットが開きます- Portfolio ページで
j/kを押すとプロジェクトを切り替えられます
フィードバックはぜひ X までどうぞ。