사용 방법
- 패턴 종류(줄무늬, 점, 체크, 지그재그) 중 하나를 선택합니다.
- 메인 색상, 강조 색상, 픽셀 단위 크기를 설정합니다.
- 미리보기를 확인하고 복사 버튼으로 CSS를 복사합니다.
이 생성기는 CSS 그라디언트만으로 반복 패턴을 만들기 때문에 호스팅할 이미지 파일이 없습니다. 메인 색상은 기본 배경이고, 강조 색상은 그 위에 그려지는 줄무늬, 점, 사각형에 쓰입니다. 크기는 10에서 100까지의 픽셀 값으로, 한 번 반복되는 단위의 크기를 정합니다.
줄무늬는 45도 대각선을 만들며 각 줄무늬의 두께는 크기 값의 절반입니다. 점은 격자 위에 작은 원을 그립니다. 체크는 두 가지 색의 체스판 무늬를 만듭니다. 지그재그는 반복되는 삼각파를 만듭니다. 각 유형은 배경색, 그라디언트로 이루어진 배경 이미지, 필요한 경우 배경 크기와 위치를 설정하는 몇 줄의 CSS를 반환합니다.
패턴을 사용하려면 복사한 선언을 컨테이너나 body 같은 요소의 규칙에 붙여 넣으세요. 이후 자신의 스타일시트에서 색상이나 크기를 바꿀 수 있습니다. 패턴이 그라디언트로 만들어져 깔끔하게 확대되고 네트워크 요청이 추가되지 않습니다.
모든 것은 브라우저에서 생성되며 아무것도 업로드되지 않습니다.
자주 묻는 질문
어떤 패턴을 쓸 수 있나요?
줄무늬, 점, 체크, 지그재그입니다.
이미지 파일이 필요한가요?
아니요. 패턴은 CSS 그라디언트를 사용하므로 호스팅하거나 불러올 이미지가 없습니다.
크기 조절은 무엇을 바꾸나요?
패턴 한 번 반복되는 단위의 픽셀 크기입니다. 값이 클수록 패턴이 커집니다.
이 CSS를 어떤 요소에든 쓸 수 있나요?
네. 배경을 넣고 싶은 요소의 규칙에 선언을 붙여 넣으세요.
입력한 내용이 업로드되나요?
아니요. CSS는 브라우저에서 만들어집니다.