둥근 모서리 생성기
네 모서리 radius를 각각 px 또는 % 단위로 설정해 CSS border-radius 축약값을 생성합니다.
사용 방법
- 단위를 고르고 네 radius 값을 조절합니다.
핵심 기능과 처리 범위
top-left, top-right, bottom-right, bottom-left 네 값을 같은 단위로 한 줄에 출력하고 live box preview를 제공합니다.
처리 원리
`r1unit r2unit r3unit r4unit` 순서로 CSS 값을 구성합니다.
예시
24px 8px 24px 8px처럼 비대칭 모서리를 만들 수 있습니다.
이럴 때 유용합니다
- card·badge의 개별 corner radius를 시각적으로 만들 때
사용 전 참고
- 타원형 slash syntax(horizontal/vertical radii)는 지원하지 않습니다.
자주 묻는 질문
순서는 CSS 표준 순서인가요?
예. top-left → top-right → bottom-right → bottom-left입니다.