본문 바로가기

CSS 생성기

그라디언트·그림자(box/text-shadow)·둥근 모서리(border-radius)·flex/grid 레이아웃을 눈으로 보며 만들고 CSS 를 복사합니다. 입력은 서버로 가지 않습니다.

입력은 이 브라우저 안에서만 쓰이며 서버로 보내지 않습니다. 만들어진 CSS 는 허용된 값(색·정수·정해진 낱말)으로만 조립해 `;` 나 `}` 가 끼어들 수 없습니다. 오래된 브라우저는 conic-gradient·gap 일부를 지원하지 않을 수 있습니다.

자주 묻는 질문

만든 CSS 는 어떻게 쓰나요?

복사한 줄을 스타일시트의 규칙 안에 붙이면 됩니다. 예: .card { 복사한 내용 }. 그라디언트는 오래된 브라우저를 위해 대체 색 줄이 먼저 나옵니다.

flex 와 grid 중 무엇을 쓰나요?

한 방향(가로 또는 세로)으로 늘어놓고 정렬할 때는 flex, 행과 열이 있는 격자에는 grid 가 어울립니다. 미리보기에서 값을 바꿔 보며 차이를 확인하세요.

입력한 값이 저장되나요?

아니요. 모든 처리는 브라우저에서 이뤄지고 서버로 전송되지 않습니다.