CSS 피치(pitch) 속성 완벽 정리 – 음성 높이 조절 방법

CSS 피치 속성이란?

피치(pitch) 속성은 음성 합성(speech synthesis)에서 말하는 목소리의 평균 높이, 즉 주파수를 지정하는 CSS 속성입니다. 이 속성을 활용하면 웹 페이지를 소리 내어 읽어 줄 때 목소리의 톤을 조절할 수 있습니다.

목소리의 평균 피치는 사용되는 음성 계열(voice family)에 따라 달라집니다. 예를 들어, 일반적인 남성 목소리의 평균 피치는 약 120Hz 수준이지만, 여성 목소리의 경우 약 210Hz 정도입니다.

사용 가능한 값

피치 속성에는 다음과 같은 값들을 지정할 수 있습니다.

• frequency(주파수) – 헤르츠(Hz) 단위로 말하는 목소리의 평균 피치를 직접 지정합니다. 예: pitch: 150Hz;
• x-low, low, medium, high, x-high – 상대적인 높낮이를 나타내는 키워드 값입니다. 이 값들은 절대적인 주파수에 매핑되지 않으며, 실제 음높이는 선택된 음성 계열에 따라 결정됩니다.

작성 예시

p {
  voice-family: male;
  pitch: 120Hz;
}

.highlight {
  pitch: high;
}

참고 사항

피치 속성은 CSS Speech 모듈에 포함된 속성으로, 스크린 리더나 음성 브라우징 환경에서 콘텐츠를 더욱 자연스럽게 들려주기 위해 사용됩니다. 일반 시각 브라우저에서는 화면 출력에 영향을 주지 않으므로, 접근성(a11y) 향상을 위한 보조 기능으로 이해하면 좋습니다.