개발자 작업 공간

앱·IT · 사람·팀 · tech-002 · 가로·세로 마스터 2장에서 11종 + 가까운 세로판 3종

생성형 AI로 만든 이미지

카드 썸네일card · 800×600 · WebP 9KB 크게 보기

가로 마스터에서 8종

hero

slide

subvisual

content-wide

content

card

square

세로 마스터에서 3종

portrait

mobile-hero

side-banner

가까운 세로판 3종 · 사람이 나오는 장면

portrait

mobile-hero

side-banner

텍스트 여백

오른쪽

세로판은 위쪽 벽·창가에 문구를 얹습니다.

밝기

어두움

흰 글씨를 쓰세요.

주요 색

0415210323370E36522D6392

초점 (주인공 위치)

object-position: 25% 50%

화면 비율이 바뀌어도 이 자리가 남도록 잘라 두었습니다.

대체 텍스트 초안

KO짙은 청회색 빈 방 왼쪽 끝에서 두 모니터 앞에 앉아 일하는 개발자의 실루엣

ENThe silhouette of a developer working at two glowing monitors at the left edge of a dark blue-grey room

이미지 받기

둘러보기

선택한 크기 카드 썸네일 card · 800×600 · WebP 9KB

이용 권리 · 모든 등급 같음

웹사이트·SNS·인쇄물 등 상업 용도에 쓸 수 있습니다.
이미지 자체를 다시 팔거나 묶어서 배포할 수 없습니다.
나온 사람을 실존 인물처럼 쓸 수 없습니다.

이용 권리 전문 보기

이 이미지가 들어간 홈페이지 예시

홈페이지 첫 화면에 넣은 모습입니다. 데스크톱에는 hero, 휴대폰에는 mobile-hero-close가 자동으로 바뀝니다.

템플릿 데모 보기

웹즐 고객

붙여 넣으면 끝나는 코드

데스크톱과 휴대폰에 다른 이미지를 보여 주고, 크기를 미리 적어 화면 밀림을 막습니다. 대체 텍스트와 초점 위치도 들어 있습니다.

무료 회원은 고른 크기 하나의 <img> 코드를 받습니다.

picture.html

<picture>
  <source media="(max-width: 767px)"
          srcset="developer-dark-room-mobile-hero-close-1080x1920.webp"
          width="1080" height="1920">
  <img src="developer-dark-room-hero-1920x1080.webp"
       srcset="developer-dark-room-hero-1920x1080.webp 1x,
               developer-dark-room-hero-2880x1620.webp 2x"
       width="1920" height="1080"
       style="object-fit: cover; object-position: 25% 50%"
       alt="짙은 청회색 빈 방 왼쪽 끝에서 두 모니터 앞에 앉아 일하는 개발자의 실루엣"
       fetchpriority="high">
</picture>