CSS | 변수 사용

블로그 이사 완료·2023년 2월 28일
0
post-thumbnail

포트폴리오랑 센텐스유 제작하면서 CSS에 변수를 사용했다.
기본 컬러나 그림자/폰트 등 변수명으로 사용했다.
기술면접 때 왜 CSS에서 변수를 사용한 적이 없었다고 했을까.. 머리가 왜 하얘졌을까..
너무 아쉽다

포트폴리오

:root {
    --main-color-white: #eae9e7;
    --main-color-black: #000;
    --point-color-yellow: #edd663;
    --point-color-orange: #fe2b01;
    --highlight-text-color: #f4e7d4;
    --Tobias-Bold: Tobias-Bold;
    --Tobias-Light: Tobias-Light;
    --Tobias-Regular: Tobias-Regular;
    --Tobias-Thin: Tobias-Thin;
    --IvyMode-Bold: IvyMode-Bold;
    --IvyMode-Light: IvyMode-Light;
    --IvyMode-Regular: IvyMode-Regular;
    --IvyMode-Thin: IvyMode-Thin;
    --Inter: 'Inter', sans-serif;
    --Montserrat: 'Montserrat', sans-serif;
}


센텐스유

:root {
    --primary-black: #222;
    --primary-skyblue: #e0effe;
    --primary-blue: #008bf8;
    --primary-white: #f8f9fa;
    --primary-grey: #c9c9c9;
    --primary-lightgrey: #dedede;
    --background: #fbfdfc;
    --prism-code-1: #7c858d;
    --prism-code-2: #abb2bf;
    --prism-code-3: #e06c75;
    --prism-code-4: #d19a66;
    --prism-code-5: #98c379;
    --prism-code-6: #56b6c2;
    --prism-code-7: #c678dd;
    --prism-code-8: #61afef;
    --prism-code-9: #c678dd;
    --neumorphic: 0.3rem 0.3rem 0.6rem #c8d0e7,-0.2rem -0.2rem 0.5rem var(--primary-white);
    --card: 0.13rem 0.13rem 0.6rem 0 rgba(0, 0, 0, 0.4);
}
profile
https://kyledev.tistory.com/

0개의 댓글