diff --git a/README.md b/README.md
index b70c601..4dd24aa 100644
--- a/README.md
+++ b/README.md
@@ -18,7 +18,7 @@ Qroko は WordPress を headless CMS として使いやすくするためのテ
 - GraphQL（WPGraphQL プラグインが必要）
 - REST API（遅いし負荷も大きいので GraphQL 推奨）
 - 最低限のファイル構成
-- 最低限の投稿プレビュー（[new.css](https://newcss.net/) を日本語用にアレンジ）
+- 最低限の投稿プレビュー
 - 投稿プレビューの幅を変更する機能
 - 日本語パーマリンクの生成を防ぐ機能
 - ログインユーザー以外をリダイレクトする機能
@@ -75,7 +75,6 @@ Qroko は WordPress を headless CMS として使いやすくするためのテ
 ## License
 
 - Theme: Qroko - GNU General Public License v2.0 or late
-- Base CSS: [new.css](https://github.com/xz/new.css) - MIT
 - Image Fonts: [JetBrains Mono](https://www.jetbrains.com/lp/mono/) - Apache 2.0 license
 
 ## Credit
diff --git a/editor-style-dark.css b/editor-style-dark.css
deleted file mode 100644
index 584da86..0000000
--- a/editor-style-dark.css
+++ /dev/null
@@ -1,14 +0,0 @@
-@media (prefers-color-scheme: dark) {
-  :root .editor-styles-wrapper {
-    --qs-tx-1: #ffffff;
-    --qs-tx-2: #eeeeee;
-    --qs-bg-1: #000000;
-    --qs-bg-2: #111111;
-    --qs-bg-3: #222222;
-    --qs-lk-1: #3291ff;
-    --qs-lk-2: #0070f3;
-    --qs-lk-tx: #ffffff;
-    --qs-ac-1: #7928ca;
-    --qs-ac-tx: #ffffff;
-  }
-}
diff --git a/editor-style.css b/editor-style.css
index e651f4d..ad4b043 100644
--- a/editor-style.css
+++ b/editor-style.css
@@ -10,71 +10,33 @@ License: GPL-2.0-or-later
 License URI: LICENSE
 */
 
-/*
-Project: Qroko Editor Style
-Base: new.css v1.1.3 - MIT (https://github.com/xz/new.css)
-*/
-:root {
-  --qs-font-sans: "Hiragino Sans", "Hiragino Kaku Gothic ProN",
-    "Noto Sans Japanese", Meiryo, "Yu Gothic Medium", sans-serif,
-    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-  --qs-font-mono: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New",
-    Meiryo, monospace, serif;
-  --qs-site-width: 620px;
-  --qs-tx-1: #1a1a1a;
-  --qs-tx-2: #202020;
-  --qs-bg-1: #ffffff;
-  --qs-bg-2: #f6f8fa;
-  --qs-bg-3: #d1d8dc;
-  --qs-lk-1: #0070f3;
-  --qs-lk-2: #0366d6;
-  --qs-lk-tx: #ffffff;
-  --qs-ac-1: #79ffe1;
-  --qs-ac-tx: #0c4047;
-}
-
 html,
 input,
 select,
 button {
-  font-family: var(--qs-font-sans);
+  font-family: var(--font-sans);
 }
 
 body {
-  background: var(--qs-bg-1);
-  color: var(--qs-tx-2);
+  background: var(--bg-1);
+  color: var(--tx-2);
   font-size: 1rem;
   line-height: 1.5;
 }
 
-.wp-block {
-  max-width: var(--qs-site-width);
-}
-
-::selection {
-  background: var(--qs-ac-1);
-  color: var(--qs-ac-tx);
-}
-
 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
-  padding-top: 1rem;
-  color: var(--qs-tx-1);
+  color: var(--tx-1);
   font-weight: 600;
   font-feature-settings: "palt";
   letter-spacing: 0.0125em;
   line-height: 1.25;
 }
 
-h2 {
-  padding-bottom: 0.25rem;
-  border-bottom: 1px solid var(--qs-bg-3);
-}
-
 h1 {
   font-size: 2rem;
 }
@@ -104,23 +66,15 @@ p {
   line-height: 1.75;
 }
 
-p:last-child {
-  margin-bottom: 0;
-}
-
 a {
-  color: var(--qs-lk-1);
-}
-
-a:hover {
-  color: var(--qs-lk-2);
+  color: var(--lk-1);
 }
 
 code,
 pre,
 kbd,
 samp {
-  font-family: var(--qs-font-mono);
+  font-family: var(--font-mono);
 }
 
 ul,
@@ -129,16 +83,20 @@ ol {
   padding-left: 0;
 }
 
+.wp-block {
+  max-width: var(--site-width);
+}
+
 .block-editor-default-block-appender
   textarea.block-editor-default-block-appender__content {
-  font-family: var(--qs-font-sans);
+  font-family: var(--font-sans);
 }
 
 .editor-post-title__block .editor-post-title__input {
-  color: var(--qs-tx-1);
+  color: var(--tx-1);
   font-size: 2rem;
   font-weight: 600;
-  font-family: var(--qs-font-sans);
+  font-family: var(--font-sans);
   font-feature-settings: "palt";
   letter-spacing: 0.0125em;
   line-height: 1.25;
@@ -147,19 +105,19 @@ ol {
 
 .wp-block-quote {
   padding: 1.5rem;
-  background: var(--qs-bg-2);
-  border-left: 5px solid var(--qs-bg-3);
+  background: var(--bg-2);
+  border-left: 5px solid var(--bg-3);
 }
 
 .wp-block-quote .wp-block-quote__citation {
-  color: var(--qs-tx-2);
+  color: var(--tx-2);
   font-size: 0.875rem;
   opacity: 0.65;
 }
 
 .block-editor-rich-text__editable code {
-  background: var(--qs-bg-2);
-  border: 1px solid var(--qs-bg-3);
+  background: var(--bg-2);
+  border: 1px solid var(--bg-3);
   border-radius: 4px;
   padding: 3px 6px;
   font-size: 0.9rem;
@@ -167,11 +125,11 @@ ol {
 
 .wp-block-code,
 .wp-block-code textarea {
-  background: var(--qs-bg-2);
+  background: var(--bg-2);
 }
 
 .wp-block-code textarea {
-  color: var(--qs-tx-2);
+  color: var(--tx-2);
   font-size: 0.9rem;
 }
 
@@ -180,31 +138,30 @@ ol {
 }
 
 .wp-block-table table th {
-  background: var(--qs-bg-2);
+  background: var(--bg-2);
 }
 
 .wp-block-table table td,
 .wp-block-table table th {
   padding: 0.5rem;
-  border: 1px solid var(--qs-bg-3);
+  border: 1px solid var(--bg-3);
 }
 
 .wp-block-table table tfoot {
-  border-top: 2px solid var(--qs-bg-3);
+  border-top: 2px solid var(--bg-3);
 }
 
 .wp-block-table figcaption {
   margin-top: 0.5rem;
   margin-bottom: 1rem;
-  color: var(--qs-tx-2);
+  color: var(--tx-2);
   font-size: 0.875rem;
   opacity: 0.65;
 }
 
 .wp-block-image figcaption {
   margin-top: 0.5rem;
-  margin-bottom: 1rem;
-  color: var(--qs-tx-2);
+  color: var(--tx-2);
   font-size: 0.875rem;
   opacity: 0.65;
 }
diff --git a/functions/gutenberg.php b/functions/gutenberg.php
index a9e06f1..7bb8bd7 100644
--- a/functions/gutenberg.php
+++ b/functions/gutenberg.php
@@ -12,26 +12,31 @@
 // Add editor style
 add_editor_style( 'editor-style.css' );
 
+// Admin Dark Mode CSS
+function admin_variable_css( $wp_admin_bar ) {
+    wp_enqueue_style( 'block-variable', get_template_directory_uri() . '/variable.css' );
+}
+add_action( 'enqueue_block_editor_assets', 'admin_variable_css' );
+
+// Admin Dark Mode CSS
+function admin_variable_dark_css( $wp_admin_bar ) {
+  $dark_mode_css = get_option('active_admin_dark_mode_css');
+  if ($dark_mode_css) {
+    wp_enqueue_style( 'block-variable-dark', get_template_directory_uri() . '/variable-dark.css' );
+  }
+}
+add_action( 'enqueue_block_editor_assets', 'admin_variable_dark_css' );
+
 // Admin Head Custom Body Max Width
 function admin_head_custom_body_max_width() {
   $body_max_width = get_option('preview_body_max_width');
 
   if($body_max_width != 620 && $body_max_width != null && $body_max_width > 0) {
     echo '<style>' .
-      ':root .editor-styles-wrapper { --qs-site-width: ' .
+      ':root .editor-styles-wrapper { --site-width: ' .
       $body_max_width .
       'px; }' .
       '</style>';
   }
 }
-add_action('admin_head', 'admin_head_custom_body_max_width');
-
-// Admin Dark Mode CSS
-function admin_dark_mode_css( $wp_admin_bar ) {
-  $dark_mode_css = get_option('active_admin_dark_mode_css');
-
-  if ($dark_mode_css) {
-    wp_enqueue_style( 'editor-style-dark', get_template_directory_uri() . '/editor-style-dark.css' );
-  }
-}
-add_action( 'enqueue_block_editor_assets', 'admin_dark_mode_css' );
\ No newline at end of file
+add_action('admin_head', 'admin_head_custom_body_max_width');
\ No newline at end of file
diff --git a/functions/import.php b/functions/import.php
index 5f6d298..a711aa7 100644
--- a/functions/import.php
+++ b/functions/import.php
@@ -6,6 +6,8 @@
 // Add files
 function add_files() {
   if ( !is_admin() ) {
+    wp_enqueue_style( 'variable', get_template_directory_uri() . '/variable.css' );
+    wp_enqueue_style( 'variable-dark', get_template_directory_uri() . '/variable-dark.css' );
     wp_enqueue_style( 'style', get_template_directory_uri() . '/style.css' );
   }
 }
diff --git a/functions/meta.php b/functions/meta.php
index 2dfaabf..32d4f59 100644
--- a/functions/meta.php
+++ b/functions/meta.php
@@ -33,7 +33,7 @@ function wp_head_custom_body_max_width() {
 
   if($body_max_width != 620 && $body_max_width != null && $body_max_width > 0) {
     echo '<style>' .
-      ':root body { --qs-site-width: ' .
+      ':root body { --site-width: ' .
       $body_max_width .
       'px; }' .
       '</style>';
diff --git a/style.css b/style.css
index 9b47292..11d49d4 100644
--- a/style.css
+++ b/style.css
@@ -6,50 +6,12 @@ Author: Qrac
 Author URI: https://qrac.jp
 Organization: QRANOKO
 Organization URI: https://qranoko.jp
-Version: 0.9.2
+Version: 1.0.0
 License: GPL-2.0-or-later
 License URI: LICENSE
 Text Domain: qroko
 */
 
-/*
-Project: Qroko Style
-Base: new.css v1.1.3 - MIT (https://github.com/xz/new.css)
-*/
-:root {
-  --qs-font-sans: "Hiragino Sans", "Hiragino Kaku Gothic ProN",
-    "Noto Sans Japanese", Meiryo, "Yu Gothic Medium", sans-serif,
-    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-  --qs-font-mono: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New",
-    Meiryo, monospace, serif;
-  --qs-site-width: 620px;
-  --qs-tx-1: #1a1a1a;
-  --qs-tx-2: #202020;
-  --qs-bg-1: #ffffff;
-  --qs-bg-2: #f6f8fa;
-  --qs-bg-3: #d1d8dc;
-  --qs-lk-1: #0070f3;
-  --qs-lk-2: #0366d6;
-  --qs-lk-tx: #ffffff;
-  --qs-ac-1: #79ffe1;
-  --qs-ac-tx: #0c4047;
-}
-
-@media (prefers-color-scheme: dark) {
-  :root {
-    --qs-tx-1: #ffffff;
-    --qs-tx-2: #eeeeee;
-    --qs-bg-1: #000000;
-    --qs-bg-2: #111111;
-    --qs-bg-3: #222222;
-    --qs-lk-1: #3291ff;
-    --qs-lk-2: #0070f3;
-    --qs-lk-tx: #ffffff;
-    --qs-ac-1: #7928ca;
-    --qs-ac-tx: #ffffff;
-  }
-}
-
 * {
   margin: 0;
   padding: 0;
@@ -94,7 +56,7 @@ html,
 input,
 select,
 button {
-  font-family: var(--qs-font-sans);
+  font-family: var(--font-sans);
 }
 
 html {
@@ -104,21 +66,16 @@ html {
 }
 
 body {
-  max-width: var(--qs-site-width);
+  max-width: var(--site-width);
   margin: 0 auto;
   padding: 1rem 1rem 40vh;
-  background: var(--qs-bg-1);
+  background: var(--bg-1);
   word-break: break-word;
-  color: var(--qs-tx-2);
+  color: var(--tx-2);
   font-size: 1rem;
   line-height: 1.5;
 }
 
-::selection {
-  background: var(--qs-ac-1);
-  color: var(--qs-ac-tx);
-}
-
 h1,
 h2,
 h3,
@@ -127,7 +84,7 @@ h5,
 h6 {
   padding-top: 1rem;
   padding-bottom: 0.25rem;
-  color: var(--qs-tx-1);
+  color: var(--tx-1);
   font-weight: 600;
   font-feature-settings: "palt";
   letter-spacing: 0.0125em;
@@ -137,7 +94,7 @@ h6 {
 h1,
 h2,
 h3 {
-  color: var(--qs-tx-1);
+  color: var(--tx-1);
   margin-bottom: 1rem;
 }
 
@@ -148,7 +105,7 @@ h6 {
 }
 
 h2 {
-  border-bottom: 1px solid var(--qs-bg-3);
+  border-bottom: 1px solid var(--bg-3);
 }
 
 h1 {
@@ -184,24 +141,20 @@ p:last-child {
 }
 
 a {
-  color: var(--qs-lk-1);
-}
-
-a:hover {
-  color: var(--qs-lk-2);
+  color: var(--lk-1);
 }
 
 blockquote,
 blockquote.wp-block-quote {
   margin-bottom: 1.25rem;
   padding: 1.5rem;
-  background: var(--qs-bg-2);
-  border-left: 5px solid var(--qs-bg-3);
+  background: var(--bg-2);
+  border-left: 5px solid var(--bg-3);
 }
 
 blockquote cite,
 blockquote.wp-block-quote cite {
-  color: var(--qs-tx-2);
+  color: var(--tx-2);
   font-size: 0.875rem;
   opacity: 0.65;
 }
@@ -216,8 +169,8 @@ header {
   padding: 1.5rem;
   padding-left: calc(50vw - 50%);
   padding-right: calc(50vw - 50%);
-  background: var(--qs-bg-2);
-  border-bottom: 1px solid var(--qs-bg-3);
+  background: var(--bg-2);
+  border-bottom: 1px solid var(--bg-3);
 }
 
 header h1,
@@ -243,12 +196,12 @@ input[type="button"] {
   cursor: pointer;
   display: inline-block;
   padding: 6px 12px;
-  background: var(--qs-lk-1);
+  background: var(--lk-1);
   border: 0;
   border-radius: 4px;
   box-sizing: border-box;
   font-size: 1rem;
-  color: var(--qs-lk-tx);
+  color: var(--lk-tx);
   text-align: center;
   text-decoration: none;
   white-space: nowrap;
@@ -274,14 +227,14 @@ input[type="reset"]:focus,
 input[type="reset"]:hover,
 input[type="button"]:focus,
 input[type="button"]:hover {
-  background: var(--qs-lk-2);
+  background: var(--lk-2);
 }
 
 code,
 pre,
 kbd,
 samp {
-  font-family: var(--qs-font-mono);
+  font-family: var(--font-mono);
 }
 
 code,
@@ -289,14 +242,14 @@ samp,
 kbd,
 pre {
   padding: 3px 6px;
-  background: var(--qs-bg-2);
-  border: 1px solid var(--qs-bg-3);
+  background: var(--bg-2);
+  border: 1px solid var(--bg-3);
   border-radius: 4px;
   font-size: 0.9rem;
 }
 
 kbd {
-  border-bottom: 3px solid var(--qs-bg-3);
+  border-bottom: 3px solid var(--bg-3);
 }
 
 pre {
@@ -307,7 +260,7 @@ pre {
 
 pre,
 pre.wp-block-code {
-  color: var(--qs-tx-2);
+  color: var(--tx-2);
 }
 
 pre code {
@@ -331,8 +284,8 @@ code pre {
 
 details {
   padding: 0.6rem 1rem;
-  background: var(--qs-bg-2);
-  border: 1px solid var(--qs-bg-3);
+  background: var(--bg-2);
+  border: 1px solid var(--bg-3);
   border-radius: 4px;
 }
 
@@ -364,13 +317,13 @@ dd::before {
 hr {
   margin: 1rem auto;
   border: 0;
-  border-bottom: 1px solid var(--qs-bg-3);
+  border-bottom: 1px solid var(--bg-3);
 }
 
 fieldset {
   margin-top: 1rem;
   padding: 2rem;
-  border: 1px solid var(--qs-bg-3);
+  border: 1px solid var(--bg-3);
   border-radius: 4px;
 }
 
@@ -399,12 +352,12 @@ table th,
 .wp-block-table table td,
 .wp-block-table table th {
   padding: 0.5rem;
-  border: 1px solid var(--qs-bg-3);
+  border: 1px solid var(--bg-3);
 }
 
 table th,
 .wp-block-table table th {
-  background: var(--qs-bg-2);
+  background: var(--bg-2);
 }
 
 table caption,
@@ -415,7 +368,7 @@ table caption,
 
 table tfoot,
 .wp-block-table table tfoot {
-  border-top: 2px solid var(--qs-bg-3);
+  border-top: 2px solid var(--bg-3);
 }
 
 figure table {
@@ -426,7 +379,7 @@ figure figcaption,
 figure.wp-block-table figcaption {
   margin-top: 0.5rem;
   margin-bottom: 1rem;
-  color: var(--qs-tx-2);
+  color: var(--tx-2);
   font-size: 0.875rem;
   opacity: 0.65;
 }
@@ -458,8 +411,8 @@ li p {
 
 mark {
   padding: 3px 6px;
-  background: var(--qs-ac-1);
-  color: var(--qs-ac-tx);
+  background: var(--ac-1);
+  color: var(--ac-tx);
 }
 
 textarea,
@@ -467,12 +420,12 @@ select,
 input {
   margin-bottom: 0.5rem;
   padding: 6px 12px;
-  background: var(--qs-bg-2);
-  border: 1px solid var(--qs-bg-3);
+  background: var(--bg-2);
+  border: 1px solid var(--bg-3);
   border-radius: 4px;
   box-shadow: none;
   box-sizing: border-box;
-  color: var(--qs-tx-2);
+  color: var(--tx-2);
 }
 
 img {
@@ -487,7 +440,7 @@ figure figcaption,
 figure.wp-block-image figcaption {
   margin-top: 0.5rem;
   margin-bottom: 1rem;
-  color: var(--qs-tx-2);
+  color: var(--tx-2);
   font-size: 0.875rem;
   opacity: 0.65;
 }
@@ -504,7 +457,7 @@ iframe {
 .pagination,
 .pager {
   padding-top: 1rem;
-  border-top: 1px solid var(--qs-bg-3);
+  border-top: 1px solid var(--bg-3);
 }
 
 .smb-btn--full,
diff --git a/variable-dark.css b/variable-dark.css
new file mode 100644
index 0000000..57336d4
--- /dev/null
+++ b/variable-dark.css
@@ -0,0 +1,13 @@
+@media (prefers-color-scheme: dark) {
+  :root {
+    --tx-1: #ffffff;
+    --tx-2: #eeeeee;
+    --bg-1: #000000;
+    --bg-2: #111111;
+    --bg-3: #222222;
+    --lk-1: #3291ff;
+    --lk-tx: #ffffff;
+    --ac-1: #7928ca;
+    --ac-tx: #ffffff;
+  }
+}
diff --git a/variable.css b/variable.css
new file mode 100644
index 0000000..f9357fe
--- /dev/null
+++ b/variable.css
@@ -0,0 +1,19 @@
+:root {
+  --font-sans: "Hiragino Sans", "Hiragino Kaku Gothic ProN",
+    "Noto Sans Japanese", Meiryo, "Yu Gothic Medium", sans-serif,
+    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  --font-sans-en: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
+    "Helvetica Neue", Arial, sans-serif;
+  --font-mono: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", Meiryo,
+    monospace, serif;
+  --site-width: 620px;
+  --tx-1: #1a1a1a;
+  --tx-2: #202020;
+  --bg-1: #ffffff;
+  --bg-2: #f6f8fa;
+  --bg-3: #d1d8dc;
+  --lk-1: #0070f3;
+  --lk-tx: #ffffff;
+  --ac-1: #79ffe1;
+  --ac-tx: #0c4047;
+}