# imghub

업로드 없이 브라우저 안에서만 돌아가는 이미지 도구 모음.
`index.html`이 허브이고, 각 도구는 폴더 하나에 정적 파일로 들어 있습니다.

| 도구 | 경로 | 하는 일 | 상태 |
|---|---|---|---|
| Color Replacer | `colorpicker/` | 스포이드로 찍은 색을 다른 색으로 치환 | 동작 |
| Triptych | `feed/` | 이미지를 3:4 패널 3장 / 3×3 그리드 9장으로 분할 | 동작 |
| Sticker Lab | `stickerlap/` | Signal 스티커팩 · 디시콘 다운로더 | 준비 중 — `assets/js/*` 미구현 |

## 도구 추가하기

`index.html` 안의 `TOOLS` 배열에 항목 하나만 추가하면 됩니다.
카드 번호, 태그 필터, 검색, 푸터 링크, 개수 표시가 전부 이 배열에서 자동으로 생성됩니다.

```js
{
  path:'newtool/',
  name:'New Tool',
  tagline:'한 줄 설명',
  tags:['태그1','태그2'],
  status:'live'        // 'live' 가 아니면 잠긴 카드로 표시
}
```

## 디자인

모든 페이지는 [`DESIGN.md`](DESIGN.md)의 토큰을 따릅니다 — 순수 검정 캔버스, 흰색 대문자 디스플레이 타입,
고스트 필 버튼 하나, 헤어라인 1px. 그라디언트 · 드롭섀도는 쓰지 않습니다.

`logo.png`(사진의 중심 워드마크)가 네 페이지 공통의 브랜드 마크이고, `favicon.png`는 그 주황 블록을
잘라낸 것입니다. 로고의 주황(#ff9000)은 DESIGN.md의 흑백 규칙에서 유일하게 벗어나는 지점인데,
브랜드 자산 자체이므로 그대로 씁니다 — UI 쪽으로는 번지지 않게 두세요.
로고는 배경이 투명이 아니라 캔버스와 같은 순수 검정(#000000)이라 그대로 얹으면 맞아떨어집니다.

## 로컬 실행

```bash
python3 -m http.server 8000
```