feelreef
브랜드 마크 feelreef

산호초 안의, 한 그루

둥근 끝의 여섯 획, 하나의 원. 이 페이지가 전부예요 — 형태, 규칙, 그리고 우리 파일이 하나도 남지 않아도 다시 그릴 수 있는 한 문장까지.

어떻게 만들어졌는지

줄기 하나, 위에서 두 잎으로 갈라지는 관, 왼쪽 아래로 뻗는 팔, 오른쪽으로 뻗는 가지와 그 위 작은 가지. 모든 획은 같은 굵기를 공유해요 — 균일함 자체가 이 마크의 개성이라, 어느 한 부분만 굵거나 가늘게 만들지 않아요.

  • 줄기 · 1개
  • 관 · U자 두 잎
  • 팔 · 1개
  • 가지+작은 가지 · 2개
  • viewBox 100×100
  • r = 46
  • stroke = 11
  • pathLength = 100
  • ½ branch · ⅔ arm

기원 · 진화 과정

이 산호는 그냥 산호가 아니에요. 산호초 전체에서 숨 쉬는 한 그루의 마크까지, 네 단계 — 완성형 안에는 feelreef의 이니셜이 숨어 있어요.

  1. 도형-배경 반전 · REEF 숨기기
    도형-배경 반전 · REEF 숨기기 문자 놀이: 산호초 전체의 네거티브 스페이스 안에 REEF 네 글자가 숨어 있어요.
  2. 가장 큰 그루를 골라 ·「r」
    가장 큰 그루를 골라 ·「r」 가장 크고 가장 곧게 선 한 그루가 맨 앞의 r이에요. 너무 꽉 차서 작은 크기에서는 뭉개져요 — 그래서 핵심만 남기는 쪽으로 수렴해요.
  3. 손으로 그린 습작
    손으로 그린 습작 여기서 여섯 획의 자세가 정해져요: 짧고 통통한 U, 「r」의 어깨, 오른쪽으로 뻗은 작은 가지.
  4. 벡터 확정본 · f+r 융합 f =곧은 줄기 · r =오른쪽 가지와 그 위 작은 가지 — 무한히 확대·축소 가능하고, 움직일 수 있어요.
도형-배경이 반전된 REEF(가장 큰 그루를 「r」로 삼은)에서, 오늘날의 f+r 융합까지 — 글자는 언제나 형태 안에 숨어 있고, 그 어느 것도 「나는 글자다」라고 소리치며 튀어나오지 않아요. 알아보면 이스터에그, 몰라봐도 그저 아름다운 산호예요.

실루엣은 하나, 채우기는 여러 가지

실루엣은 1밀리도 움직이지 않아요. 바뀌는 건 채우기 레이어뿐이에요. 위쪽 줄은 일상 디지털용 공식 네 가지 버전, 아래 줄은 종이와 특수 표면용이에요.

일상 디지털 — 공식 네 가지 버전

주 배지
오션 · 일상 배지 기본으로 이걸 쓰세요: 내비게이션 바, 파비콘, 아바타, 작은 크기 전부.
주력
성장 그러데이션 · 밑동은 심해, 끝은 코랄 줄기 밑동은 심해, 가지 끝은 코랄 — 새로운 성장은 끝에서 일어나요.
모션
성장 그러데이션 · 모션 영양분이 줄기를 타고 끝까지 올라가며 천천히 숨을 쉬어요.
코랄 석양 · 어두운 배경용 심해 그러데이션 원판에 따뜻한 코랄 — 어두운 배경용.

종이와 특수 표면

모노 · 포지티브 원본 방향 · 도장, 레이저 각인, 단색 인쇄.
짙은 배경 · 포지티브 짙은 색 종이 · 흰 원판에 먹빛 산호.
글리프 단독 · 주변 텍스트 색을 따름 currentColor · 인라인, 로딩 상태, 워터마크.

컨테이너와 여백

코랄은 프레임 안에서 중앙에 놓이고 사방에 고르게 여백을 둬요. 정원이 기본 컨테이너이고, 앱 아이콘이 필요한 자리에서는 스퀴클이 대신해요.

주요
중앙 원 · 여백 포함 무게중심은 중앙, 사방이 고르게
스퀴클 · 앱 아이콘에 맞춤
스퀴클 · 심해 짙은 배경에 석양빛 코랄

워드마크

항상 소문자, 항상 Young Serif, 항상 배지 옆에 배지 지름의 약 3분의 1 간격으로. 공식 버전은 세 가지: 성장 그러데이션이 주력, 어두운 배경에는 코랄 석양, 화이트 버전은 그러데이션 띠 위에 올려요.

feelreef
성장 그러데이션 워드마크 · 주력
feelreef
코랄 석양 워드마크
feelreef
그러데이션 배경 · 화이트 워드마크

REEF with X · 모듈 네이밍 시스템

모든 모듈은 「REEF with X」 패밀리의 일원이에요 — 같은 코랄, 같은 REEF, 같은 연결어. 바뀌는 건 끝에 붙는 기능명과 그 전용 색뿐이에요.

RiseEmergeEvolveFlourish — REEF의 어원이자, 이 시리즈 이름의 유래예요.

REEF with Members
REEF with Card
REEF with Site
REEF with Editor
REEF with Blog
REEF with Lingo
REEF with Members
REEF with Checkout
REEF with Domain
REEF with GAIDO
REEF with KAITO
REEF with Century
REEF with Ejecta
REEF with MCP
REEF with Page
REEF with PWA
REEF with Email

각 로고락업은 단일 색이에요 — 코랄 배지, REEF, 기능명이 그 모듈 고유의 색을 공유하고, with만 회색으로 남아요. 무료 입문 Card는 초록, 핵심 Site는 오션, 결제 담당 Checkout/Members는 초록과 코랄, AI 콤비 GAIDO/KAITO는 둘 다 보라 계열이에요. 배지와 REEF는 항상 같은 색이라, 로고락업이 하나의 대상처럼 읽혀요.

레시피지, 파일이 아니에요

오래 살아남는 문장은 자산이 아니라 지침으로 전해져요 — 가문(家紋)이 육백 년간의 수공 조각을 견뎌낸 건, 조각가들이 사본을 받아서가 아니라 그것이 무엇인지를 전해 들었기 때문이에요. 그래서 이 산호에도 탈출구가 있어요: 문장 하나면 파일도, 업체도, 저희도 없이 전체를 다시 만들 수 있어요.

원 안에 산호 한 그루: 곧은 줄기가 가운데에 서서, 위쪽에서 짧고 통통한 U 모양 두 잎으로 갈라져요. 절반 높이에서 오른쪽으로 가지가 뻗고, 그 위에 작은 가지가 하늘을 가리켜요. 3분의 2 높이에서 왼쪽으로 팔 하나가 늘어지며 갈고리처럼 둥글게 말려요. 세 잎은 모두 같은 호에서 나와요. 전체 여섯 획, 같은 굵기, 둥근 끝.
  • ½ branch
  • arm
  • crown
  • ×3 모호 하나 ×3

천 년을 살아남은 문장들 중 아카이브 덕분에 살아남은 건 하나도 없어요 — 살아남은 건 누구나 처음부터 다시 만들 수 있는 한 문장이었어요. 이건 다섯 번째 형태가 아니에요. 형태는 위에서 본 그대로이고, 바뀌는 건 그것이 전달되는 매체예요.

컴퍼스로 재현 ½・⅔ 눈금과 모호 하나 — 자와 컴퍼스로 그릴 수 있어요.
인장 · 음각 네거티브 스페이스에서도 살아남아요 — 새길 수 있고, 찍을 수 있고, 낙인찍을 수 있어요.
수기 모사 · 허용 범위 모든 획이 0.5~1칸 어긋나도 여전히 같은 코랄이에요. 정체성은 좌표가 아니라 위상에 있어요.
솔직히 말하면: 천 년을 보장하는 형태를 설계할 수 있는 사람은 없어요. 설계할 수 있는 건 그것이 전달되는 방식이에요. 쉘의 조개껍데기 로고는 백 년 동안 여덟 번 다시 그려지면서도 죽지 않았고, 가문(家紋)은 육백 년간 수많은 장인의 손으로 새겨지면서도 자기 자신을 잃지 않았어요. 둘 다 같은 것에 의지했어요: 불변량과, 다시 그릴 수 있는 허락. 여기서 불변량은 위상(여섯 획의 관계), 분수 비율(½・⅔・⅐), 모호 하나이고, 나머지는 세대마다 재해석해도 돼요. 그리고 「더 영원하게」 만들겠다고 팔이나 가지를 빼버리는 건 거부해요 — 그건 이름 없는 나무가 되어버릴 뿐이에요. 천 년을 살아남은 문장은 전부 「독특하면서도 재현 가능」했지, 「최소한」이 아니었어요. 그리고 편리하게도, 이건 feelreef 자체의 유전자와 똑같아요: 이 로고는 자기만의 탈출구를 가지고 있어요 — 파일이 필요 없고, 저희가 살아있을 필요도 없어요. 문장 하나면 함께 가져갈 수 있어요.

사용법

여백
사방에 최소 획 하나 굵기만큼 여백을 두세요 — 배지 지름의 약 12%예요. 그 안에는 텍스트도, 다른 도형도, 테두리도 넣지 않아요.
최소 크기
배지는 20px까지 (파비콘으로 쓸 수 있는 크기예요). 글리프 단독은 14px까지. 인쇄에서는 6mm예요.
그러데이션
그러데이션은 한 번에 하나만, 그것도 컬러 버전에만 사용해요. 모노는 딱 두 가지, 검정과 흰색뿐이에요. 전부 SVG 그러데이션으로 구현해요. 실루엣과 스트로크 경로는 불변이고, 바뀌는 건 stroke가 참조하는 그러데이션뿐이에요 — 움직이는 버전도 그러데이션만 움직이지, 형태는 절대 움직이지 않아요. 원칙: 그러데이션은 한 번에 하나만, 컬러 버전에만. 포지티브(흰 원판에 짙은 코랄, 원래 방향)는 종이용, 일상 디지털은 항상 오션 배지예요. 모노는 딱 검정과 흰색뿐이에요.
워드마크
워드마크의 그러데이션은 background-clip:text를 쓰고, 방향은 배지와 같아요(왼쪽 심해 → 오른쪽 코랄). 여백, 글자 형태, 배지 비율은 기본값 그대로 고정이에요 — 그러데이션 워드마크는 컬러가 필요한 자리에만. 공식 문서, 본문, 작은 크기에서는 항상 단색 워드마크로 돌아가요.
모션
통칙: 동작은 한 번에 한 종류만. 움직이는 건 transform과 dashoffset뿐이고 실루엣 경로는 절대 바꾸지 않아요. 가지별 움직임은 항상 관절에 고정되고 성장 순서(줄기 → 왼팔 → 오른쪽 가지 → 관과 가지)로 위상이 어긋나요. prefers-reduced-motion에서는 항상 완전한 정지 형태로 멈춰요.
컨테이너
코랄은 컨테이너 안에서 중앙에 놓이고 82%로 축소해 여백을 남기며, 실루엣 자체는 절대 바뀌지 않아요. 정원은 소셜 아바타나 원형이 필요한 곳에, 스퀴클(rx≈34)은 iOS와 실물 앱 아이콘에 써요.
  • 그림자나 추가 그러데이션 금지
  • 찌그러뜨리거나 늘이지 않기
  • 저대비 배색 금지
  • 회전 금지 (흔들림 애니메이션은 예외)
20px
32px
48px
76px

움직임은 세 가지예요

성장 · 등장 줄기 밑동에서 가지 끝까지 자라나요. 처음 등장할 때 딱 한 번만 실행돼요. 등장 · 한 번 · 1.8초 · ease-out · 성장 순서대로
가지별 흔들림 · 대기 줄기는 움직이지 않아요. 모든 가지는 자기만의 관절에 고정되어 각자의 진폭과 위상으로 흔들려요 — 물이 산호를 스쳐 지나가는 것처럼요. 대기 · 루프 · 3.2–4.4초 · ease-in-out
성장 루프 · 로딩 끝까지 자라고, 잠시 멈추고, 다시 뿌리까지 줄어들었다가 다시 자라요 — 같은 성장을, 반복할 뿐이에요. 로딩/AI 사고 중 · 루프 · 3.6초 · ease-in-out

파일

SVG 파일 네 개, 마음껏 가져가세요: 오션 배지, 도장·단색 인쇄용 모노 버전, 주변 텍스트 색을 그대로 따라가는 글리프 단독, 그리고 앱 아이콘용 스퀴클.

벡터

비트맵

SVG를 받지 않는 곳들을 위해서예요 — GitHub나 Slack 아바타, npm 패키지, 앱 등록 페이지 같은 곳. 정사각형 버전이 일부러 풀블리드인 이유: 그런 서비스들은 자기가 알아서 잘라내고 둥글게 만들거든요. 그러니 원이 들어간 투명 PNG를 주면 결국 원 안에 원이 생기고 말아요.