아이콘을 클릭하고 저장하고 나만의 스타일로 수정하세요
Flaticon 컬렉션과 함께
컬렉션은 아이콘을 정리하고 시각화하며 프로젝트의 일관성을 유지하고 싶은 분들께 유용합니다. 사용이 간편하고 초보자와 전문가 모두에게 도움이 될 수 있습니다.
더 많이 보기
정리하기
다른 패키지에서 필요한 아이콘을 찾아 한 곳에 보관하세요. 컬렉션을 프로젝트별로 분리하고 아이콘을 추가, 삭제, 수정하거나 이름을 변경할 수 있습니다.
저장
"아이콘 백업"을 클릭하고 컬렉션의 사본을 다운로드하세요. 팀원들과 공유하거나 나중에 직접 사용할 수도 있습니다.
편집
모든 단색 아이콘을 다른 색상으로 색칠하려면 "컬렉션 색칠" 기능을 이용하고 가장 어울리는 색조를 선택하세요.
독점 기능
PNG, SVG, EPS 그리고 PSD 포맷 뿐만 아니라 컬렉션을 “아이콘 폰트” 또는 “SVG Sprite” 형태로 다운로드할 수 있습니다. 이 기능을 웹 디자이너가 사용하면 모든 아이콘이 포함된 파일을 코드 형태로 다운로드할 수 있습니다. 반응형 디자인을 작업하고 CSS3로 쉽게 조작할 수 있는 간단한 방법입니다.
아이콘 폰트
모든 브라우저에서 지원되며 작업하기 간편합니다. 색상을 변경하거나 아이콘 폰트 모양에 따라 그림자를 추가할 수 있습니다. 단, 이 기능은 단색 아이콘에 대해서만 동작합니다.
웹에서 컬러 아이콘을 사용하려면 SVG Sprite를 클릭해 주세요.
<head>
…
<link rel="stylesheet" type="text/css" href="your_website_domain/css_root/flaticon.css">
…
</head>
.flaticon-airplane
SVG 스프라이트
아이콘 폰트와 매우 비슷한 SVG 스프라이트를 이용하면 폰트를 코드 형태로 다운로드해 웹에서 사용할 수 있습니다. CSS3로 완전히 사용자화할 수도 있고, "아이콘 폰트"와는 달리 컬러 아이콘과도 함께 작동합니다.
<div hidden>
<svg style="display: none;" xmlns="http://www.w3.org/2000/svg"> <symbol id="blueberries" viewbox="0 0 53.308 53.308">
<title>
blueberries
</title>
<path d="M39.685,2.953c-7.524,0-13.623,6.099-13.623,13.623c0,2.243, 0.552,4.353,1.512,6.219 c1.496-0.565,3.11-0.888,4.804-0.888c5.281,0,9.851,3.011,12.111,7.404c5.15-1.944,8.819-6.905,8.819-12.735 C53.308,9.052,47.208,2.953,39.685,2.953z" style="fill:#003879;">
</path>
…
</svg>
</div>
<svg class="icon">
<use xlink:href="#blueberries"/>
</svg>
#blueberries