오버레이 사용자 지정

템플릿으로 시작한 뒤 필요한 부분에만 URL 옵션과 CSS를 사용하세요.

가장 빠른 방법: 템플릿 선택

StreamElements 또는 Streamlabs 채팅 스킨이 있나요? 채팅 스킨 가이드로 사용자 지정 위젯 가져오기.

템플릿은 CSS를 처음부터 작성하지 않고 완성도 있는 오버레이를 만드는 가장 쉬운 방법입니다.

검색, 카테고리 필터, 템플릿 미리 보기가 있는 템플릿 갤러리 — 템플릿을 검색하고 필터링한 뒤 생성된 오버레이 URL을 OBS에 복사하세요.

사용자 지정 단계

단계	용도	위치
템플릿 제어	빠른 시각적 변경.	템플릿 갤러리.
URL 매개변수	동작, 레이블, 필터, 배율, 제한.	오버레이 URL 쿼리 문자열.
OBS 사용자 지정 CSS	하나의 OBS 소스에 작은 스타일 변경 적용.	OBS 브라우저 소스 속성.
호스팅/자체 호스팅 CSS	여러 오버레이에서 재사용 가능한 스타일.	`&css=` 또는 `&b64css=`.
사용자 지정 오버레이	동작을 완전히 사용자 지정.	사용자 지정 오버레이 가이드.

공통 URL 옵션

featured.html?session=YOUR_SESSION&scale=1.1&limit=10

session 은 오버레이를 올바른 채팅방에 연결합니다.
scale 은 CSS를 다시 작성하지 않고 크기를 바꿉니다.
limit 은 지원되는 페이지에서 계속 표시할 메시지 수를 제어합니다.
hidesource 은 도크에서 플랫폼 소스 레이블을 숨깁니다(dock.html 전용).
css 그리고 b64css 은 사용자 지정 스타일을 로드합니다.

OBS 전에 미리 보기

스타일이 적용된 Social Stream 채팅 메시지 출력을 보여 주는 예시 오버레이 미리 보기 — OBS에서 시험하기 전에 일반 브라우저에서 최종 URL을 여세요.

일반적인 해결 방법

브라우저에서는 정상이나 OBS에서는 다르게 보임: OBS 사용자 지정 CSS를 제거하고 브라우저 소스를 새로고침하세요.
글꼴이 표시되지 않음: 직접 HTTPS 글꼴 파일을 사용하고 CORS/핫링크 규칙을 확인하세요.
아무것도 보이지 않음: 불투명도, 색상, 필터, 페이지에 강조/이벤트 페이로드가 필요한지 확인하세요.
URL을 바꿔도 변화가 없음: OBS 소스를 새로고침하거나 URL을 교체하세요.