CSS 스크롤바 생성기
웹사이트용 맞춤형 CSS 스크롤바를 시각적으로 생성합니다. 스크롤바 너비, 트랙 색상, 썸(thumb) 색상, 테두리 및 둥근 모서리를 사용자 정의하고 실시간 미리보기를 확인할 수 있습니다. Chrome, Safari, Edge, Firefox와 호환됩니다.
사용자 설정
{{ scrollbarWidth }}px
{{ scrollbarHeight }}px
{{ thumbMinHeight }}px
{{ thumbRadius }}px
{{ trackRadius }}px
{{ shadowBlur }}px
{{ shadowOpacity }}%
스크롤바 실시간 미리보기
스크롤 가능한 미리보기 영역
이곳은 스크롤바 미리보기 영역입니다. 오른쪽 또는 하단의 스크롤바를 드래그하여 스크롤 효과를 확인할 수 있습니다.
왼쪽 패널에서 매개변수(너비, 테두리, 테두리 반경 등)를 조정하면 이 영역의 스크롤바가 실시간으로 업데이트됩니다.
이 도구는 Chrome 등 Webkit 기반 브라우저(테두리, 마우스 오버, 그림자 등 풍부한 스타일 지원)와 Firefox 브라우저를 모두 지원합니다.
스크롤바 스타일이 마음에 들면 오른쪽의 "CSS 복사"를 클릭하여 프로젝트에 붙여넣으십시오.
{{ t('color_item') }} {{ i }}
이곳은 스크롤바 미리보기 영역입니다. 오른쪽 또는 하단의 스크롤바를 드래그하여 스크롤 효과를 확인할 수 있습니다.
왼쪽 패널에서 매개변수(너비, 테두리, 테두리 반경 등)를 조정하면 이 영역의 스크롤바가 실시간으로 업데이트됩니다.
이 도구는 Chrome 등 Webkit 기반 브라우저(테두리, 마우스 오버, 그림자 등 풍부한 스타일 지원)와 Firefox 브라우저를 모두 지원합니다.
스크롤바 스타일이 마음에 들면 오른쪽의 "CSS 복사"를 클릭하여 프로젝트에 붙여넣으십시오.
참고: 테두리, 둥근 모서리, 그림자 및 마우스 오버 상태는 주로 Chrome/Safari/Edge 브라우저에서 작동합니다. Firefox는 표준 제한으로 인해 수치 너비와 기본 색상 설정만 지원합니다.