유튜브 UI 폰트 - yutyubeu UI ponteu

유투브 제작할 때 폰트를 잘못 사용하여 저작권 사냥꾼들에게 걸리면 소송걸리고 손해배상 해 줘야합니다. 저작권도 지키고 피해 볼 일도 없는 무료 폰트를 사용하면됩니다.

■ 구글 노토 폰트 : Goole Noto Fonts

이 폰트는 구글에서 Open Font로 배포하고 있습니다. 가이드 라인 명시된 내용을 보면 UI, 웹사이트, 동영상제작, 광고판등 폭넓게 명시되어있습니다.

현재는 사용하지 않은 외계어 수준의 문자들도 많습니다. 필요한 폰트만 골라 설치하면 될 겁니다. adobe에서 배포하는 무료폰트와 같습니다. 같은 프로젝트 하에서 배포되는 폰트입니다.

■ 네이버 폰트 저장소 : 바로가기

이 곳은 무료로 공개된 폰트들이 아주 많이 있습니다. TTF도 있고 OTF도 있으니 사용할 때 확인 해야 합니다.

■ 웹 폰트 : Goole Web Fonts

일반인에겐 크게 필요하진 않지만 이쁜 글꼴로된 웹폰트도 있습니다. 이 폰트들은 정식 배포가 아니고 시험판입니다. 일종의 얼리억세스. 웹페이지에도 얼리억세스 폰트라 써있네요. 고르기 힘들 정도로 아주 많이 있어요.

이곳에 접속해서 마우스로 원하는 폰트위에 더블클릭하면 직접 시험해볼 수도 있어요.

요로코롬.. 직접 글을 써 볼 수 있습니다.

아래는 메모장 내용입니다.

@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
나눔글꼴의 CSS웹폰트 링크(이 빨간글자는 메모장에 없습니다. 없이 넣어주세요)

body {
  background-color: transparent!important;
}

/* Transparent background. */
yt-live-chat-renderer {
  background-color: transparent!important;
}

/* Outlines */
yt-live-chat-renderer * {
  text-shadow: -4px -4px #000000,-4px -3px #000000,-4px -2px #000000,-4px -1px #000000,-4px 0px #000000,-4px 1px #000000,-4px 2px #000000,-4px 3px #000000,-4px 4px #000000,-3px -4px #000000,-3px -3px #000000,-3px -2px #000000,-3px -1px #000000,-3px 0px #000000,-3px 1px #000000,-3px 2px #000000,-3px 3px #000000,-3px 4px #000000,-2px -4px #000000,-2px -3px #000000,-2px -2px #000000,-2px -1px #000000,-2px 0px #000000,-2px 1px #000000,-2px 2px #000000,-2px 3px #000000,-2px 4px #000000,-1px -4px #000000,-1px -3px #000000,-1px -2px #000000,-1px -1px #000000,-1px 0px #000000,-1px 1px #000000,-1px 2px #000000,-1px 3px #000000,-1px 4px #000000,0px -4px #000000,0px -3px #000000,0px -2px #000000,0px -1px #000000,0px 0px #000000,0px 1px #000000,0px 2px #000000,0px 3px #000000,0px 4px #000000,1px -4px #000000,1px -3px #000000,1px -2px #000000,1px -1px #000000,1px 0px #000000,1px 1px #000000,1px 2px #000000,1px 3px #000000,1px 4px #000000,2px -4px #000000,2px -3px #000000,2px -2px #000000,2px -1px #000000,2px 0px #000000,2px 1px #000000,2px 2px #000000,2px 3px #000000,2px 4px #000000,3px -4px #000000,3px -3px #000000,3px -2px #000000,3px -1px #000000,3px 0px #000000,3px 1px #000000,3px 2px #000000,3px 3px #000000,3px 4px #000000,4px -4px #000000,4px -3px #000000,4px -2px #000000,4px -1px #000000,4px 0px #000000,4px 1px #000000,4px 2px #000000,4px 3px #000000,4px 4px #000000;


  font-family: "nanumgothic";
  font-size: 40px!important;
  font-weight: 800!important;
  line-height: 40px!important;
}
yt-live-chat-text-message-renderer #content,
yt-live-chat-legacy-paid-message-renderer #content {
  overflow: initial; !important
}

/* Hide scrollbar. */
yt-live-chat-item-list-renderer #items{
  overflow:hidden!important;
}

/* Hide header and input. */
yt-live-chat-header-renderer,
yt-live-chat-message-input-renderer {
  display: none!important;
}

/* Reduce side padding. */
yt-live-chat-text-message-renderer,
yt-live-chat-legacy-paid-message-renderer {
  padding-left: 4px!important;
  padding-right: 4px!important;
}

/* Avatars. */
yt-live-chat-text-message-renderer #author-photo,
yt-live-chat-legacy-paid-message-renderer #author-photo {

    width: 45px!important;
  height: 45px!important;
  border-radius: 33px!important;
  margin-right: 8.25px!important;
}

/* Hide badges. */
yt-live-chat-text-message-renderer #author-badges {
  display: none!important;
  vertical-align: text-top!important;
}

/* Timestamps. */
yt-live-chat-text-message-renderer #timestamp {

    color: #999999!important;
  font-family: "nanumgothic";
  font-size: 30px!important;
  font-weight: 800!important;
  line-height: 30px!important;
}

/* Badges. */
yt-live-chat-text-message-renderer #author-name[type="owner"],
yt-live-chat-text-message-renderer yt-live-chat-author-badge-renderer[type="owner"] {
  color: #ffd600!important;
}

yt-live-chat-text-message-renderer #author-name[type="moderator"],
yt-live-chat-text-message-renderer yt-live-chat-author-badge-renderer[type="moderator"] {
  color: #ff8000!important;
}

yt-live-chat-text-message-renderer #author-name[type="member"],
yt-live-chat-text-message-renderer yt-live-chat-author-badge-renderer[type="member"] {
  color: #0f9d58!important;
}

/* Channel names. */
yt-live-chat-text-message-renderer #author-name {
  color: #cccccc!important;
  font-family: "nanumgothic";
  font-weight: 800!important;
  font-size: 40px!important;
  line-height: 40px!important;
}

yt-live-chat-text-message-renderer #author-name::after {
  content: ":";
  margin-left: 4px;
}

/* Messages. */
yt-live-chat-text-message-renderer #message,
yt-live-chat-text-message-renderer #message * {
  color: #ffffff!important;
  font-family: "nanumgothic";
  font-size: 40px!important;
  font-weight: 800!important;
  line-height: 40px!important;
}

/* Fan Funding Messages. */
yt-live-chat-legacy-paid-message-renderer #event-text,
yt-live-chat-legacy-paid-message-renderer #event-text * {
  color: #ffffff!important;
  font-family: "nanumgothic";
  font-size: 40px!important;
  font-weight: 800!important;
  line-height: 40px!important;
}

yt-live-chat-legacy-paid-message-renderer #detail-text,
yt-live-chat-legacy-paid-message-renderer #detail-text * {
  color: #ffffff!important;
  font-family: "nanumgothic";
  font-size: 40px!important;
  font-weight: 800!important;
  line-height: 40px!important;
}

yt-live-chat-legacy-paid-message-renderer {
  background-color: #0f9d58!important;
  margin: 4px 0!important;
  padding: 4px!important;
}

yt-live-chat-text-message-renderer a,
yt-live-chat-legacy-paid-message-renderer a {
  text-decoration: none!important;
}

yt-live-chat-text-message-renderer[is-deleted],
yt-live-chat-legacy-paid-message-renderer[is-deleted] {
  display: none !important;
}