-
티스토리 파비콘(웹사이트 아이콘) 만들기☕️TISTORY 2021. 1. 27. 16:37반응형
📌 파비콘이란?
Favicon : 인터넷 웹 브라우저의 주소창에 표시되는 웹사이트나 웹페이지를 대표하는 아이콘이다.
Tistory 기본 파비콘 왼쪽에 보이는 아이콘을 파비콘이라고 부르네요.
티스토리는 파비콘을 별도로 설정할 수 있는데 블로그에 특색을 주기 딱 좋습니다. ㅎㅎㅎ
미뤄왔던 파비콘을 만들어 봅니다. go go ~ ⭐️
파비콘 만들기를 검색하면 여러 무료 사이트가 나오는데요.
저는 그중에 사용하기 쉬워보이는 사이트 몇 가지를 활용해서 만들었습니다.
1. 이미지 만들기
회원가입만 하면 무료로 이미지를 만들 수 있는 사이트입니다.
규격은 지정하기 나름인데 저는 500x500 픽셀인 로고 프레임을 선택했습니다.
어차피 파비콘은 굉장히 작게 표시되기 때문에 (16x16) 이미지를 꽉꽉 채워줍니다.
작업한 후 다운로드 버튼 클릭! PNG로 저장합니다.
2. 이미지 배경 제거하기
Canva 유료 버전을 사용 중이라면 건너뛰셔도 됩니다. 개인적으로 애정하는 사이트입니다. ❣️
이미지에서 배경 제거 – remove.bg
이미지 배경 제거: 클릭 한 번 없이, 5초만에, 100% 자동, 무료.
www.remove.bg
이미지를 업로드하고 편집 버튼을 눌러 원하는 부분만 투명 배경으로 지정해줍니다.
3. 파비콘 만들기
Favicon Generator for perfect icons on all browsers
The ultimate favicon generator. Design your icons platform per platform and make them look great everywhere. Including in Google results pages.
realfavicongenerator.net
"rounded favicon", "favicon cornor radius" 검색하다 발견한 사이트인데, 막상 적용해 보니 심플한 게 더 맘에 들어서
Use the original image as is. 옵션을 선택했습니다.
프레임을 넣고 싶으면 Add margins and a plain background. 옵션을 선택하시면 됩니다.
생성 버튼은 스크롤 한참 내려 맨 밑에 있습니다.
이제 다 만들었으니 실제로 적용해 봅시다.
블로그 관리 > 관리 > 블로그를 누르면 아이콘과 파비콘을 설정할 수 있습니다.
불러오기 클릭하고 변경사항 저장 합니다.
블로그관리 > 관리 > 블로그 > 파비콘 불러오기 > 변경사항 저장 이제 티스토리를 새로고침해 보면 ✨예쁘게✨ 적용되어 있는 모습 확인할 수 있습니다.
라이트모드 / 다크모드 파비콘 디자인은 여러 가지를 시도해봤는데 Simple is the best!
마음에 드는 로고가 완성돼서 블로그 접속 시마다 뿌듯할 예정이랍니다. 😎😎😎
반응형