setting : 폰트 weight 커스텀 및 자간행간 재설정

Author: KongMezu

src/styles/globals.css

@@ -178,34 +178,41 @@ html, body {
 @utility text-background { color: var(--background); }
 @utility text-foreground { color: var(--foreground); }
 
-
 /* 폰트 *//* Pretendard */
-@utility text-display-lg { font-size:5.7rem; font-family: var(--font-sans); }
-@utility text-display-md { font-size:5.2rem; font-family: var(--font-sans); }
-@utility text-display-sm { font-size:3.6rem; font-family: var(--font-sans); }
+@utility text-display-lg { font-size:5.7rem; line-height: 6.4rem; letter-spacing: -0.025em; font-family: var(--font-sans); }
+@utility text-display-md { font-size:5.2rem; line-height: 4.5rem; font-family: var(--font-sans); }
+@utility text-display-sm { font-size:3.6rem; line-height: 4.4rem; font-family: var(--font-sans); }
 
-@utility text-headline-lg { font-size:3.2rem; font-family: var(--font-sans); }
-@utility text-headline-md { font-size:2.8rem; font-family: var(--font-sans); }
-@utility text-headline-sm { font-size:2.4rem; font-family: var(--font-sans); }
+@utility text-headline-lg { font-size:3.2rem; line-height: 4rem; font-family: var(--font-sans); }
+@utility text-headline-md { font-size:2.8rem; line-height: 3.2rem; font-family: var(--font-sans); }
+@utility text-headline-sm { font-size:2.4rem; line-height: 3.2rem; font-family: var(--font-sans); }
 
-@utility text-title-lg { font-size:2.2rem;  font-family: var(--font-sans); }
-@utility text-title-md { font-size:1.6rem;  font-family: var(--font-sans); }
-@utility text-title-sm { font-size:1.4rem; font-family: var(--font-sans); }
+@utility text-title-lg { font-size:2.2rem; line-height: 2.8rem; letter-spacing: 0.015em; font-family: var(--font-sans); }
+@utility text-title-md { font-size:1.6rem; line-height: 2.4rem; letter-spacing: 0.01em; font-family: var(--font-sans); }
+@utility text-title-sm { font-size:1.4rem; line-height: 2rem; letter-spacing: 0.01em; font-family: var(--font-sans); }
 
-@utility text-label-lg { font-size:1.4rem; font-family: var(--font-sans); }
-@utility text-label-md { font-size:1.2rem; font-family: var(--font-sans); }
-@utility text-label-sm { font-size:1.1rem; font-family: var(--font-sans); }
+@utility text-label-lg { font-size:1.4rem; line-height: 2rem; letter-spacing: 0.01em; font-family: var(--font-sans); }
+@utility text-label-md { font-size:1.2rem; line-height: 1.6rem; letter-spacing: 0.05em; font-family: var(--font-sans); }
+@utility text-label-sm { font-size:1.1rem; line-height: 1.6rem; letter-spacing: 0.05em; font-family: var(--font-sans); }
 
-@utility text-body-lg { font-size:1.4rem; font-family: var(--font-sans); }
-@utility text-body-md { font-size:1.2rem; font-family: var(--font-sans); }
-@utility text-body-sm { font-size:1rem; font-family: var(--font-sans); }
+@utility text-body-lg { font-size:1.4rem; line-height: 2.4rem; letter-spacing: 0.05em; font-family: var(--font-sans); }
+@utility text-body-md { font-size:1.2rem; line-height: 2rem; letter-spacing: 0.025em; -family: var(--font-sans); }
+@utility text-body-sm { font-size:1rem; line-height: 1.6rem; letter-spacing: 0.04em; font-family: var(--font-sans); }
 
 /* JEN Serif */
-@utility text-display-serif { font-size:3.6rem; font-family: var(--font-serif); }
-@utility text-headline-lg-serif { font-size:3.2rem; font-family: var(--font-serif); }
-@utility text-headline-md-serif { font-size:2.4rem; font-family: var(--font-serif); }
-@utility text-headline-sm-serif { font-size:2rem; font-family: var(--font-serif); }
-@utility text-label-serif { font-size:1.4rem; font-family: var(--font-serif); }
+@utility text-display-serif { font-size:3.6rem; line-height: 4.6rem; letter-spacing: 0.6em; font-family: var(--font-serif); }
+@utility text-headline-lg-serif { font-size:3.2rem; line-height: 4rem; letter-spacing: 0.2em; font-family: var(--font-serif); }
+@utility text-headline-md-serif { font-size:2.4rem; line-height: 3.2rem; letter-spacing: 0.2em; font-family: var(--font-serif); }
+@utility text-headline-sm-serif { font-size:2rem; line-height: 2.4rem; letter-spacing: 1.2rem;  font-family: var(--font-serif); }
+@utility text-label-serif { font-size:1.4rem; line-height: 2rem; letter-spacing: 0.4rem; font-family: var(--font-serif); }
+
+/* font-weight */
+@utility font-light { font-weight: 100 !important; }
+@utility font-regular { font-weight: 200 !important; }
+@utility font-medium { font-weight: 300 !important; }
+@utility font-semibold { font-weight: 400 !important; }
+@utility font-bold { font-weight: 500 !important; }
+
 
 /* Layout */
 @utility layout-flex { display: var(--display-flex); }
@@ -218,3 +225,4 @@ html, body {
 
 @utility max-w-mobile { max-width: var(--max-w-mobile); }
 @utility min-w-100 { min-width: var(--min-w-100); }
+