Toolzy

CSS 삼각형 생성기

테두리 기법으로 CSS 삼각형을 생성합니다.

width: 0;
height: 0;
border-left: 40px solid transparent;
border-right: 40px solid transparent;
border-bottom: 60px solid #6366f1;

원하는 방향, 크기, 색상의 순수 CSS 삼각형을 만들고 border 코드를 복사하세요.

사용 방법

  1. 방향과 크기를 고르세요.
  2. 색상을 고르세요.
  3. CSS를 복사하세요.

자주 묻는 질문

어떻게 작동하나요?
크기가 0인 요소에 투명 테두리를 쓰고 한 면에만 색을 입힙니다.
화살표에도 쓸 수 있나요?
네, CSS 삼각형은 툴팁과 드롭다운 화살표에 흔히 쓰입니다.

관련 도구