CSS Border Radius 생성기
코너별 슬라이더·px/%·실시간 미리보기·복사용 CSS로 모서리를 둥글게 만듭니다. 무료, 업로드 없음, 브라우저 처리.
border-radius: 16px;🔒 브라우저에서 생성되며 업로드되지 않습니다.
모서리를 시각적으로 둥글게
각 코너의 슬라이더를 조절하거나(또는 연동해 함께 이동) px와 %를 전환하면 미리보기가
실시간으로 갱신됩니다. border-radius 선언이 복사용으로 생성되며, 모든 코너가 같으면 축약형으로 줄여줍니다.
px vs %
픽셀 반경은 고정이고, 퍼센트 반경은 요소 크기에 따라 커지므로 50%는 정사각형을 원으로, 그 외에는
타원으로 만듭니다.
자주 묻는 질문
원은 어떻게 만드나요?
단위를 %로 하고 정사각형 요소의 모든 코너를 50%로 설정하면 완전한 원이 됩니다.
코너를 따로 설정할 수 있나요?
네. "모든 코너 연동"을 끄면 왼쪽 위·오른쪽 위·오른쪽 아래·왼쪽 아래를 각각 조절할 수 있습니다.
업로드되는 게 있나요?
아니요. 슬라이더 값으로 브라우저에서 CSS를 생성합니다.