CSS border-radius 생성기
네 모서리의 border-radius를 px, %, rem 단위로 개별 또는 연동하여 조절합니다. 실시간 미리보기와 바로 복사할 수 있는 CSS 코드를 제공합니다.
네 모서리 값을 묶거나 각각 조절하고 px, %, rem 중 단위를 선택해 CSS border-radius 선언을 생성합니다.
CSS border-radius 만드는 방법
- 네 모서리를 함께 움직일지 Linked 옵션을 정합니다.
- 각 모서리 슬라이더를 조절하고 단위를 선택합니다.
- 미리보기를 확인하고 border-radius 선언을 복사합니다.
생성 규칙
각 모서리는 0~100 정수 슬라이더를 사용하고 선택한 단위를 숫자 뒤에 그대로 붙입니다.
네 숫자가 모두 같으면 한 값으로 축약하고 다르면 CSS 모서리 순서대로 네 값을 출력합니다.
개인정보와 제한
모든 처리는 브라우저 로컬에서 이루어집니다. 단위를 바꿀 때 기존 숫자를 환산하지 않으며 같은 숫자에 새 단위만 적용합니다.
Border radius 자주 묻는 질문
모서리를 따로 조절할 수 있나요?
네. Linked를 끄면 됩니다.
지원 단위는 무엇인가요?
px, %, rem입니다.
px에서 rem으로 바꾸면 자동 환산되나요?
아니요. 숫자는 유지되고 단위만 바뀝니다.
네 값의 순서는 어떻게 되나요?
왼쪽 위, 오른쪽 위, 오른쪽 아래, 왼쪽 아래입니다.
CSS를 바로 복사할 수 있나요?
네. 생성된 선언을 복사할 수 있습니다.