Border Radius & Squircle — Learning Bundle
테두리 반경 & 스퀴클 — 학습 번들
이 가이드는 세 가지 아이디어를 구분합니다. 일반 CSS border-radius, 초안 모서리 형태: 스퀴클(squircle), 그리고 기타 스퀴클 유사 형태 또는 플랫폼 마스크입니다. 이 번들은 하나의 표준 디자인 용어가 아닙니다.
다른 예시
디자인 시스템 엔지니어가 24 px border-radius 대비책을 테스트해요. 지원되는 브라우저에서는 초안 squircle 모서리도 함께 보여요. 메모에는 앱 아이콘 마스크가 별도의 플랫폼 에셋이라고 적혀 있죠. 하지만 이게 CSS 키워드를 썼다는 증거는 아니에요.
주요 부분
- 01Content surface
- 02Distinct visual treatment
- 03Action and readability check
사용할 때
이 가이드를 사용하여 모서리 모양, 브라우저 지원 및 대체 동작을 선택하고 기록하십시오. 또한 웹 모서리와 맞춤형 또는 플랫폼 모양을 구분합니다.
다음 경우에는 사용하지 마세요
모든 둥근 직사각형이 스퀴클은 아닙니다. 큰 반지름은 초안 CSS 값이 아닙니다. 실험적인 코너는 항상 예비 및 클리핑 테스트 없이 배포하지 마세요.
코드에서 사용된 이름
border-radius + @supports (corner-shape: squircle) 출시하기 전에
Check that every member concept has its own name and link. Show all members in the same situation. Give a visible rule for when each one applies and which groups are valid. Never present the bundle as one canonical pattern or as parts that can be swapped freely.
Outcome:Complete the task with 테두리 반경 & 스퀴클 — 학습 번들 (Border Radius & Squircle — Learning Bundle)。 User context:디자인 시스템 엔지니어가 24 px border-radius 대비책을 테스트해요. 지원되는 브라우저에서는 초안 squircle 모서리도 함께 보여요. 메모에는 앱 아이콘 마스크가 별도의 플랫폼 에셋이라고 적혀 있죠. 하지만 이게 CSS 키워드를 썼다는 증거는 아니에요. Learning bundle to unpack:테두리 반경 & 스퀴클 — 학습 번들 (Border Radius & Squircle — Learning Bundle)。 Canonical members:CSS 테두리 반경 (CSS Border Radius)、CSS 스퀴클 코너 (CSS Squircle Corner) Why this comparison helps:이 가이드를 사용하여 모서리 모양, 브라우저 지원 및 대체 동작을 선택하고 기록하십시오. 또한 웹 모서리와 맞춤형 또는 플랫폼 모양을 구분합니다. Do not treat the bundle as one pattern when:모든 둥근 직사각형이 스퀴클은 아닙니다. 큰 반지름은 초안 CSS 값이 아닙니다. 실험적인 코너는 항상 예비 및 클리핑 테스트 없이 배포하지 마세요. Comparison requirements: Name every member concept on its own. Explain its job and limits. Show every member in the same real situation. Give a visible sign for when to use, combine, or leave out each member. Decision quality: Keep platform and evidence limits clear. Show which members can work together. Point out false matches, unsafe swaps, and cases that need another concept. Acceptance criteria: A reader can explain each member in one sentence and tell them apart in the example. They can defend the chosen member or valid group and open every canonical guide. Evidence and limits (evidence boundary):이것은 규범적인 표준이 아닙니다. 이름, 한계 및 예상 동작은 출처마다 달라질 수 있습니다. Unknowns to confirm: Target platform, decision setting, limits, and evidence needed to use, combine, or leave out members.
이 요청을 확인하세요
Review how 테두리 반경 & 스퀴클 — 학습 번들 (Border Radius & Squircle — Learning Bundle) is used now. Definition: 이 가이드는 세 가지 아이디어를 구분합니다. 일반 CSS border-radius, 초안 모서리 형태: 스퀴클(squircle), 그리고 기타 스퀴클 유사 형태 또는 플랫폼 마스크입니다. 이 번들은 하나의 표준 디자인 용어가 아닙니다. Release checks: Check that every member concept has its own name and link. Show all members in the same situation. Give a visible rule for when each one applies and which groups are valid. Never present the bundle as one canonical pattern or as parts that can be swapped freely. Before changing code, list the evidence, gaps, severity, and the smallest safe fix.