폰트 : MinSans
사용 : MinSans-Bold, MinSans-Medium, MinSans-Regular, MinSans-Light
클래스 내 적용이름 : MinB, Min1, Min2, Min3 (순서대로!)
폰트 크기 - 컨피그 참조 : https://nekocalc.com/px-to-rem-converter 이걸로 px-rem변환해서 표기
Title : size 1~6
Subtitle : size 1~2
Text : size 1~7
컬러는 아직 추가 안함
예시
<Title size="1" >타이틀1</Title>
<Title size="2" >타이틀1</Title>
<Title size="3" >타이틀1</Title>
<Title size="4" >타이틀1</Title>
<Title size="5" >타이틀1</Title>
<Title size="6" >타이틀1</Title>
<Subtitle size="1" >서브타이틀1
</Subtitle>
<Subtitle size="2" >서브타이틀1
</Subtitle>
<Text size="1" >타이틀1</Text>
<Text size="2" >타이틀1</Text>
<Text size="3" >타이틀1</Text>
<Text size="4" >타이틀1</Text>
<Text size="5" >타이틀1</Text>
<Text size="6" >타이틀1</Text>
<Text size="7" >타이틀1</Text>

color
커스텀 파레트 제작
dgray: {
100: '#F7FAFC',
200: '#EDF1F6',
300: '#CCD5E0',
400: '#A1ADC0',
500: '#727F96',
600: '#1B202C',
900: '#1ABC9C', //얘는 그린
},
dred: {
100: '#FEEAED',
200: '#F9A9B5',
300: '#FF526D',
400: '#DB4A60',
500: '#B94153',
},
dpurple: {
100: '#EDDFFF',
200: '#9262F7',
300: '#752BD9',
400: '#5619A9',
},
실제 사용 예
그린!
<div className="w-40 flex flex-row">
<div className="bg-dgray-100 w-5 p-5">a</div>
<div className="bg-dgray-200 w-5 p-5">a</div>
<div className="bg-dgray-300 w-5 p-5">a</div>
<div className="bg-dgray-400 w-5 p-5">a</div>
<div className="bg-dgray-500 w-5 p-5">a</div>
<div className="bg-dgray-600 w-5 p-5">a</div>
<div className="bg-white w-5 p-5">a</div>
<div className="bg-dgray-900 w-5 p-5">a</div>
</div>
레드랑 퍼플!
div className="w-40 flex flex-row">
<div className="bg-dred-100 w-5 p-5">a</div>
<div className="bg-dred-200 w-5 p-5">a</div>
<div className="bg-dred-300 w-5 p-5">a</div>
<div className="bg-dred-400 w-5 p-5">a</div>
<div className="bg-dred-500 w-5 p-5">a</div>
<div className="bg-white w-5 p-5">a</div>
<div className="bg-dpurple-100 w-5 p-5">a</div>
<div className="bg-dpurple-200 w-5 p-5">a</div>
<div className="bg-dpurple-300 w-5 p-5">a</div>
<div className="bg-dpurple-400 w-5 p-5">a</div>
</div>