기본 그래픽 개념

래스터(비트맵) vs 벡터 (Vector)

아래 대화형 데모를 통해 픽셀 그리드와 수학적 경로의 본질적인 차이를 느껴보세요.

확대 배율: 1.0x
슬라이더를 드래그하여 세부 사항 확인
래스터 (Raster)
본질: 픽셀 그리드
벡터 (Vector)
본질: 수학적 경로

래스터 기술 상세

  • 구성 원리:

    "픽셀"이라는 색상 사각형의 격자로 구성됩니다. 각 픽셀은 특정 색상 정보(RGB 값)를 포함합니다. 이미지 품질은 해상도(DPI/PPI)에 직접적으로 의존합니다.

  • 색상 표현:

    복잡한 색상 그라데이션, 그림자 및 세부 사항을 처리하는 데 매우 능숙합니다. 사진사실적인 그림을 위한 유일한 선택입니다.

  • 일반 형식:
    JPG PNG GIF TIFF WEBP

벡터 기술 상세

  • 구성 원리:

    수학 공식(점, 선, 곡선)을 기반으로 합니다. 예를 들어, 원을 그리는 것은 각 픽셀을 기록하는 것이 아니라 중심 좌표와 반지름 `r`을 정의하는 것입니다. 따라서 품질 저하 없이 무한 확대가 가능합니다.

  • 파일 특성:

    파일 크기는 보통 매우 작으며(명령만 저장) 크기와 무관합니다. 사진과 같은 복잡한 색상 변화를 표현하는 데는 적합하지 않습니다.

  • 일반 형식:
    SVG AI EPS PDF
특성 차원래스터 (Raster)벡터 (Vector)
해상도 의존성
의존 (Dependent)
독립 (Independent)
파일 크기
큼 (고해상도 시)
매우 작음 (단순 도형 시)
변환 난이도
벡터화 어려움 (트레이싱 필요)
래스터화 매우 쉬움
최적 용도
사진, 복잡한 그림, 텍스처
로고, 아이콘, 타이포그래피
팁: 현대 웹 디자인에서는 Retina 화면의 선명도를 위해 아이콘에는 SVG를, 사진 배경에는 WebP/JPG를 사용하는 것이 일반적입니다.