웹 배경과 텍스처를 위한 무의존성 WebGL 스타일 캔버스 셰이더로, npm(React 또는 vanilla JS)에서 사용하거나 Paper에서 시각적으로 디자인할 수 있습니다.
azlen/initialis
브라우저에서 끝없이 장식용 드롭캡과 채식 이니셜을 생성하고, 둘러보고 북마크하거나 다운로드할 수 있습니다.
- 스타
- 180
- 포크
- 12
- 열린 이슈
- 0
- 마지막 커밋
- 7일 전
어떤 프로젝트인가요?
INITIĀLIS는 장식용 이니셜을 탐색할 수 있는 정적 웹 앱입니다. 장식용 이니셜은 채식 필사본과 인쇄 서적에서 텍스트 블록의 시작 부분에 쓰이는 크고 화려하게 꾸민 대문자입니다. 각 이니셜은 글자, 테두리와 바탕, 장식, 텍스처, 두세 가지 잉크 색을 종이 배경 위에 조합해 브라우저에서 실시간으로 생성하므로 이미지가 미리 저장되지 않습니다.
끝없이 이어지는 화면을 드래그해 둘러보고, 이니셜을 클릭해 변형을 생성하고, 마음에 드는 것을 북마크해 모을 수 있습니다. 이니셜 하나 또는 전체 컬렉션을 여러 크기의 PNG, 애니메이션 WebP 또는 MP4 성장 애니메이션 클립, JSON 설정으로 다운로드하거나 링크로 공유할 수 있습니다. 라이브러리 스크립트를 사용하면 다른 페이지에 공유 링크나 설정 객체의 이니셜을 삽입할 수 있으며, 렌더러가 모듈식이라 새 패턴과 테두리를 별도 파일로 추가할 수 있습니다.
이 사이트는 웹 워커에서 WebGL2를 지원해야 하며, 오래된 페이지 미리보기에는 WebGPU를 사용하고 지원되지 않으면 단색 화면으로 대체합니다. 빌드 단계가 없으므로 어떤 정적 파일 서버로든 폴더를 제공하면 됩니다.
핵심 기능
- 01글자, 테두리, 장식, 텍스처, 잉크 설정을 바탕으로 각 이니셜을 브라우저에서 실시간 생성합니다.
- 02끝없이 이어지는 캔버스를 둘러보고 선택한 이니셜의 변형을 생성합니다.
- 03마음에 드는 이니셜을 북마크하고 컬렉션으로 다운로드하거나 공유합니다.
- 04여러 크기의 PNG, 애니메이션 WebP 또는 MP4 성장 애니메이션 클립, JSON 설정으로 내보냅니다.
- 05간단한 라이브러리 스크립트나 설정 객체를 사용해 다른 페이지에 이니셜을 삽입합니다.
- 06새 패턴과 테두리를 별도의 모듈로 추가합니다.
활용 사례
- 인쇄물이나 웹 페이지 디자인에 사용할 장식용 드롭캡을 찾을 때.
- 초대장, 포스터, 책의 장 시작 부분에 사용할 채식 스타일의 글자를 만들 때.
- 공유 링크나 설정 파일을 사용해 웹사이트에 생성한 이니셜을 삽입할 때.
- 디자인 영감을 얻기 위해 역사적·현대적 장식 문자 스타일을 살펴볼 때.
빠른 시작
- 1
아직 설치하지 않았다면 Python 3을 설치하세요
- 2
정적 웹 서버로 프로젝트 폴더를 제공하세요
python3 -m http.server 8000 - 3
WebGL2를 지원하는 브라우저에서 로컬 주소를 여세요
사용 전 알아둘 점
- 이 사이트는 웹 워커에서 WebGL2가 필요하므로 오래된 브라우저에서는 작동하지 않습니다.
- In context 기능은 WebGPU가 필요하며, WebGPU를 사용할 수 없으면 일반 페이지로 대체됩니다.
토픽
자주 묻는 질문
- initialis은(는) 무엇인가요?
- 브라우저에서 끝없이 장식용 드롭캡과 채식 이니셜을 생성하고, 둘러보고 북마크하거나 다운로드할 수 있습니다. INITIĀLIS는 장식용 이니셜을 탐색할 수 있는 정적 웹 앱입니다. 장식용 이니셜은 채식 필사본과 인쇄 서적에서 텍스트 블록의 시작 부분에 쓰이는 크고 화려하게 꾸민 대문자입니다. 각 이니셜은 글자, 테두리와 바탕, 장식, 텍스처, 두세 가지 잉크 색을 종이 배경 위에 조합해 브라우저에서 실시간으로 생성하므로 이미지가 미리 저장되지 않습니다.
- initialis은(는) 무료로 사용할 수 있나요? 라이선스는 무엇인가요?
- initialis은(는) MIT 라이선스의 오픈소스입니다. 상업용 제품에 사용하기 전에 라이선스 조건을 확인하세요.
- initialis은(는) 아직 유지보수되고 있나요?
- 활발히 유지보수 중. initialis의 마지막 커밋은 2026년 10월 31일입니다.
- initialis은(는) 어디에 사용할 수 있나요?
- 인쇄물이나 웹 페이지 디자인에 사용할 장식용 드롭캡을 찾을 때. 초대장, 포스터, 책의 장 시작 부분에 사용할 채식 스타일의 글자를 만들 때. 공유 링크나 설정 파일을 사용해 웹사이트에 생성한 이니셜을 삽입할 때. 디자인 영감을 얻기 위해 역사적·현대적 장식 문자 스타일을 살펴볼 때.
- initialis는 어떻게 설치하나요?
- 아직 설치하지 않았다면 Python 3을 설치하세요 정적 웹 서버로 프로젝트 폴더를 제공하세요: python3 -m http.server 8000 WebGL2를 지원하는 브라우저에서 로컬 주소를 여세요
- initialis은(는) 어디서 받을 수 있나요?
- 소스 코드와 설치 방법은 GitHub에 있습니다: https://github.com/azlen/initialis
요약은 프로젝트 README를 바탕으로 AI가 작성했습니다. GitHub 통계는 매일 갱신됩니다.
관련 프로젝트
Windows, macOS, Linux에서 OpenType, TrueType, UFO 및 기타 글꼴 형식을 만들고 편집하고 변환할 수 있는 무료 오픈소스 글꼴 편집기입니다.
p5.js는 웹에서 창작 코딩과 드로잉을 하고 인터랙티브하거나 제너레이티브한 그래픽을 만들 수 있는 무료 오픈 소스 JavaScript 라이브러리입니다.
브라우저에서 OpenStreetMap 데이터를 사용해 선택한 도시의 모든 도로를 지도처럼 한 번에 시각화합니다.
포인트 목록을 바탕으로 붓의 털, 먹물, 갈필 효과를 시뮬레이션하며 획을 그리는 브라우저 기반 붓글씨 엔진입니다.
사진을 펜, 연필, 잉크, 물감으로 종이에 그린 듯한 하나의 연속선 그림으로 바꾸고, 브라우저에서 그리는 과정을 촬영합니다.