diff --git a/frontend/src/components/ErrorMessage/index.tsx b/frontend/src/components/ErrorMessage/index.tsx
index 0989b171a04357d38f7777bfb4ff05d17385d490..9db9602454c26cc4087b884e795434180397aecb 100644
--- a/frontend/src/components/ErrorMessage/index.tsx
+++ b/frontend/src/components/ErrorMessage/index.tsx
@@ -1,11 +1,12 @@
+import { Colors } from '@blueprintjs/core'
 import { css } from '@emotion/css'
 import type { FC, PropsWithChildren } from 'react'
 
 const div = css`
-  background: #c20b0b;
-  color: var(--white-1);
-  border-radius: var(--md);
-  padding: var(--md) var(--lg);
+  background: ${Colors.RED1};
+  color: ${Colors.WHITE};
+  border-radius: 0.5rem;
+  padding: 0.5rem 1rem;
 `
 
 const ErrorMessage: FC<PropsWithChildren> = ({ children }) => (
diff --git a/frontend/src/global.css b/frontend/src/global.css
index 7f4526b166382b97ab095eb25fbfa0815cf032e9..e158e8e19abe2906abb76b56b4e14ac5d8e545d1 100644
--- a/frontend/src/global.css
+++ b/frontend/src/global.css
@@ -5,27 +5,12 @@ html, body, #root {
 
 html {
   overflow-x: hidden;
-
-  /* overflow-y: hidden; */
 }
 
 body.bp5-dark {
   background-color: #2f343c;
 }
 
-body {
-  --green-1: #12ae12;
-  --white-1: #fffefe;
-  --grey-1: #aeaeae;
-  --grey-2: #9e9e93;
-  --blue-1: #43d4ee;
-  --sm: 0.25rem;
-  --md: 0.5rem;
-  --lg: 1rem;
-  --xl: 2rem;
-  --xxl: 4rem;
-}
-
 * {
   box-sizing: border-box;
 }
@@ -64,7 +49,6 @@ h6 {
 ::-webkit-scrollbar-track {
   border-radius: 8px;
   background-color: transparent;
-  /* border: 1px solid rgba(255, 255, 255, 0.2); */
   border-left: 2px none;
   border-right: 2px none;
   border-top: 2px none;