본문 바로가기

프로그래머/CSS

[HTML/CSS] 웹 상에서 원하는 폰트를 적용해보자 | 폰트 다운로드 | google fonts 윈도우/맥OS 상에 기본으로 설치되어 있지 않은 폰트를 웹상에서 구현하고 싶을 때, google fonts를 참고하자. fonts.google.com [ Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com ](https://fonts.google.com) 원하는 폰트를 검색하고, 오른쪽에 select this style을 클릭. 원하는 몇가지의 폰트를 선택한 뒤, 오른쪽 위의 아이콘을 클릭하면, 선택한 항목의 폰트에 대한 html/css embed 코드가 생성된다. 복사한 뒤, html사이에 다음과 같은 형식으로 복붙한다. 이를 완성하면, html 실행시 해당하는 폰트가 없으면.. 더보기
[CSS] 웹페이지 아이콘 만들기 | favicon 만드는 사이트 어느정도 규모 이상의 웹페이지라면, 브라우저에서 탭을 띄울 때, 이름 왼쪽에 아이콘이 뜬다. 이를 favicon이라고 한다. 개인이 웹페이지를 만들 때, 이러한 favicon을 어떻게 만들고 적용시킬까? www.favicon.cc [ favicon.ico Generator Preview Favicon in original size: www.favicon.cc ](https://www.favicon.cc/) 위 페이지를 방문해보자. favicon을 직접 그리거나, 이미지를 불러와 만들 수도 있다. 예를들어 다음과 같은 이미지를 불러오면, 이렇게 변환해준다. 아래쪽의 download favicon을 누르면 .ico 형태로 다운로드 된다. 그리고 작성한 html 파일에서 link rel="icon"으로 적용시.. 더보기
[Emojipedia] 무료 이모티콘 다운로드 사이트 | 이모지피디아 https://emojipedia.org 📙 Emojipedia — 😃 Home of Emoji Meanings 💁👌🎍😍 emojipedia.org 플랫폼 별 다르게 생긴 이미지들을 무료로 복사하거나, 다운로드할 수 있는 사이트 더보기
[CSS] css 디자인시 적절한 색을 찾을 수 있는 사이트 css 디자인시, 기본 설정 컬러 외의 컬러를 찾고 싶은 경우가 있다. http://colorhunt.co 위 사이트를 방문하면 원하는 컬러에 대한 코드를 알 수 있다. trend 혹은 popular 탭에서 일반인들도 적절한 색 조합을 찾아 홈페이지에 적용시킬 수 있다. 더보기