---
type: snippet
tags: ['css']
status: release
ctime: 2025-01-17
mtime: 2025-01-17
---

import QuoteLink from '@components/QuoteLink.astro'

<QuoteLink url="https://github.com/css-modules/css-modules/blob/master/docs/values-variables.md">
Exporting values variables
</QuoteLink>

```css
@value b from "./b.module.css";

.root {
  color: aquamarine;
}

.root :global(.b) {
  text-decoration: line-through;
}
```


CSS 모듈에서 변수를 값으로 내보내고 사용하는 방법

- PostCSS와 `postcss-modules-values` 플러그인을 사용하여 CSS 모듈 내에서 변수 값 내보내기 지원
- 색상 변수를 정의하는 파일 생성
  - 변수 선언: `@value` 구문 사용
- 다른 CSS 모듈 파일에서 해당 변수를 가져와서 사용
  - 변수 가져오기 및 CSS 클래스에 적용

