Border Radius 생성기

이 도구 소개

CSS border-radius 생성기는 모서리별 슬라이더나 전체 모서리 슬라이더로 요소의 border-radius를 퍼센트로 설정하고, 원, 잎사귀, 블롭 같은 프리셋도 제공하며 CSS를 복사해 줍니다.

사용 방법

1. 모서리별 슬라이더를 움직이거나 전체 모서리를 사용합니다.
2. Circle, Leaf, Blob 같은 프리셋을 적용해 봅니다.
3. 필요하면 미리보기 크기를 바꿉니다.
4. CSS 복사를 누릅니다.

알아두면 좋은 점

• border-radius는 왼쪽 위, 오른쪽 위, 오른쪽 아래, 왼쪽 아래 순서로 최대 네 개의 값을 받습니다.
• 정사각형 요소에 border-radius: 50%를 주면 원이 됩니다.
• 퍼센트 반경은 요소 크기에 따라 달라지고, 픽셀 반경은 고정됩니다.
• 마주 보는 모서리의 반경을 다르게 하면 SVG 없이 잎사귀나 블롭 모양을 만들 수 있습니다.
• border-radius는 현재 모든 브라우저에서 접두사 없이 지원됩니다.

모든 처리는 브라우저 안에서 이루어집니다. 입력한 내용은 업로드되거나 저장되지 않습니다.

자주 묻는 질문