나이키 로고 HTML 코드 (NIKE Logo SVG Code) 다운로드

나이키 로고를 일러스트레이터로 제작 후 이것을 다시 HTML 코드로 변경했습니다. SVG 벡터 아이콘 코드이며 본문에 소개한 HTML코드를 모두 한번에 사용하시면 됩니다. 먼저 예제 소스 미리보기입니다.

미리보기

See the Pen NIKE_Logo_HTML(SVG) by rgy0409 (@rgy0409) on CodePen.

사용된 코드는 HTML 뿐입니다. CSS나 JS는 전혀 없습니다.

코드 다운로드

위의 코드펜에 마크업 되어있는 HTML코드를 몽땅 긁어가셔도 됩니다. 코드펜 오류로 인해 보이지 않는 경우에는 아래의 텍스트 문서를 다운로드 받으시어 사용하시면 됩니다.

코드 다운로드

나이키 로고 (HTML)

사용 방법

별거없죠? 그냥 통째로 복사 후 원하는 위치에 그대로 HTML 코드를 붙여넣기해서 사용하면 됩니다. 크기를 변경하는 방법은 간단하게 transform: scale(1); CSS 속성을 path의 클래스명에 사용하면 됩니다. 원래 크기가 1이므로 크기를 줄이려고 한다면 1보다 낮은 소수값을 사용하면 됩니다. 소수점 두번째 자리까지도 인식합니다. 위의 미리보기에 있는 CSS 탭의 코드를 살펴보시기 바랍니다. 변수를 변경해서 적용시켜 보세요. 실시간으로 나이키 로고의 크기가 변경됩니다. 오늘 내용 끝!