diff --git a/frontend/src/components/Article.js b/frontend/src/components/Article.js
index bbca44185922a7a70faf4892944e5f4167361fdf..65e5874b45fd3cce639e71a7f597dc5001eebed5 100644
--- a/frontend/src/components/Article.js
+++ b/frontend/src/components/Article.js
@@ -30,12 +30,12 @@ function Article({ data }) {
 
   return (
     <div className="article" onClick={() => { console.log(_id); MoveTo(`/post/${_id}`) }}>
-      <p>{keyword}</p>
+      <p className="keyword">#{keyword}</p>
       <h1>{title}</h1>
       <h3>{author.nickname} {date}</h3>
-      <p>{content}</p>
+      <p className="content">{content}</p>
       <p>{listItem}</p>
-      <p>�볤� {comments.length}  |  醫뗭븘�� {likes.length}</p>
+      <p className="comments">�볤� {comments.length}  |  醫뗭븘�� {likes.length}</p>
     </div>
   );
 }
diff --git a/frontend/src/css/Article.css b/frontend/src/css/Article.css
index 29b8edafd5e5be848f4123d64733c3256e1caada..eabb36e01760ef4fc4b949bdb580816b71370f04 100644
--- a/frontend/src/css/Article.css
+++ b/frontend/src/css/Article.css
@@ -1,7 +1,40 @@
+@font-face {
+  font-family: 'JalnanGothic';
+  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_231029@1.1/JalnanGothic.woff') format('woff');
+  font-weight: normal;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'Pretendard-Regular';
+  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
+  font-weight: 400;
+  font-style: normal;
+}
+
 .article {
   background-color: #ffffff;
   border: 1px solid gray;
   border-radius: 10px;
+  width: 100vh;
+}
+
+.article h1 {
+  font-family: 'JalnanGothic';
+}
+
+.article .keyword {
+  font-weight: bold;
+  
+}
+
+.article .content {
+  font-family: 'Pretendard-Regular';
+}
+
+.article .comments {
+  font-family: 'Pretendard-Regular';
+  font-weight: 700;
 }
 
 .article:hover {