Color Code Gradient PoC
[clr #rrggbb]…[/clr]
커스텀 마크업 그라데이션 생성기
사용법
색상
: 색상 칩 클릭으로 변경,
+ 색상
으로 stop 추가,
×
로 제거(최소 2개).
각도
: 다이얼을 드래그하거나 숫자 입력(0–359°). 0° = 위→아래, 90° = 왼→오른, 시계 방향.
색 단계
: 그라데이션을 N단계로 양자화. 값이 작을수록 인접 문자끼리 같은 색을 공유해 태그가 통합되고 압축률이 올라감. (각도 0°에서는 라인 단위라 무시)
공백 문자 건너뛰기
: 공백/전각공백 등을 색칠 대상에서 제외해 태그를 줄임. (각도 0°에서는 무시)
Preview 드래그
: 미리보기 위에서 원하는 방향으로 드래그하면 그 선이 그라데이션의 시작/끝 앵커가 됨(PowerPoint 방식). 드래그 중 실시간 반영. 다이얼·숫자 입력을 다시 조작하면 앵커가 해제되고 전체 범위 자동 맞춤으로 복귀.
복사용/미리보기 토글
: 오른쪽 상단 스위치로 전환.
복사
버튼은 마크업 텍스트를 클립보드로 복사.
색상
+ 색상
각도
°
색 단계
공백 문자 건너뛰기
입력 텍스트
,. -‐…・・…‐- ` _ ｀`ヽ ‐-- --‐ ′ -‐……‐- .:i:i:i:,ｘ‐ -=ﾐ:i:i:i:i:ヽ /:i:i:i/:i:i:i:i:i:i:i:i＼:i:i:∧ √:i:/i:i:i:i:i: ﾔ:i:i:i:i:V/:∧ j{:i:i√:i:i:ｉ}:i:ｉ:}:i:i:i:i:i:}:i:i:ｉ:‘, j{:i:i:{:i{:i:i/}:i:i:ﾊ:i:i:i:i:ハ㍉‘, j{:i:i:{:ﾏ芯ぅ ィ芯ｱ _ﾉ:i‘, ,ﾞ:i:i:i:∧ ' /i:i:i:i:i:i:′ ,ﾞ:i:i:/:i:込 - ｲ:i:i|:i:i:i:i:i:′ ,ﾞ:i:ｉ/:i:i:i:i:|!:＞ - ＜┐:i:i|:i:i:i:i:i:i:. /:i:i/:i:}:i:i:i:|!:i{ ﾞ＼:|:i:{i:i:i:i:i:. /:i:i/:i:iﾉ:i:i:iﾉ'"´'ｰ- -/ニﾆ{:i:{ｰ ,,_i:. /:i:i/:／__／ /二＞乂___彡ﾍ /:i:i/:i:/ﾆ/ /ニﾆヽニ/ニニ ヘ / /:i:/ﾆ/ _-ニﾆﾆ/二{ニﾆく＼ ＼ /／{ﾆ.ﾞ _-ニニ／二ﾆ{ニ:/､丶∨} 丶 //二{ﾆ{: . . :_-ニﾆ／ |ニニ{ﾆ∧ } / /:i{ニﾆVﾑ: : : :_-ﾆﾆ／ ｜ﾆ=/:i/ ‘:, l./ /i:ｉ∧ﾆニ＼＼/ニ／ニl＿__｣ニ/:i/ ′__ !､ /:i:i/:i:ｉ:＼ニﾆヽ{:／ニニニニﾆｱﾟ:i:i丶 /{ { 〉 /:i:i/:i:i:ｉ:ｉ:√≧=-{-=ニ二ﾆ=-／:i:i:i:i:i:i:i:＼{ﾆ＼__ノ=} /:i:i/:i:i:i:i:i:/ﾆ/ニﾆ:{ニニニニ=-〈:i:i:i:i:i:i:i:i:ｉⅥﾆﾆ「ニﾆ}`､ /:i:i/:i:i:i:i:i:/ﾆ/ニニ={ニニニニニ沁,:i:i:i‘,:i:i:i:i＼ﾆ:{ﾆ／ `､ / /:i:i:i:i:i:/ﾆ/ニニﾆ={ニニニニニﾆ沁,:i:i:‘,:i:i:i:i:i:i￣:i:ﾟ｡ `､ /:i:i:i:i:i:/ﾆ/ニニﾆﾆ/ニニニニニニﾆ沁,:i:‘,:i:i:i:i:i:i:i:i:i:i:iﾟ｡ `､ .:i:i:i:i:i:ｉ:/ﾆ/ニニﾆﾆ/:{ニニニニニニニ/∧:i‘,:i:i:i:i:i:i:i:i:i:i:i:iﾟ｡ ､ .:i:i:i:i:i:i:i/ﾆ/ニニﾆﾆ/ﾆ:{ﾆﾆニニニニニ二/∧:i‘,:i:i:i:i:i:i:i:i:i:i:i:i:ﾟ｡ ` .:i:i:i:i:i:i:i:〈ﾆ/￣ﾆﾆ=- ﾞﾆ{ 辷二ニﾆﾆ=- -=ﾆ￣‘,:i:i:i:i:i:i:. :i:i:i:i:i:i:ｉ:ｉ:ﾟ｡ ‘, ／i:i:i:i:i:i:i:i:i:ｉ{√二ﾆﾆ/ニﾆ{二￣￣ニ{ニﾆ{ニニニ‘,:i:i:i:i:i:i:. :i:i:i:i:i:i:i:ｉ:ｉﾟ｡ ‘, ／i:i:i:i:i:i:i:i／:i:i:i:L二二/二二{ニﾆ{ニﾆﾆ{ニﾆ{ニニニﾆ〉:i:i:i:i:i:i:. :i:i:i:i:i:ｉ:ｉ/∧ } . .:i:i:i:i:i:i:i:i:i:｡ﾟ:i:i:i:i:i:i:i:{:::::::::´^''ｰ-└‐ └-- ´^''ｰ-...::^ﾟ~￣:i:i:i:i:i:i:i:i:. i:i:i:i:i:i:i:i:/∧ } .:i:i:i:i:i:i:i:i:i:/:i:i:i:i:rｾニ{＿:::::::::::::::::::::___| |:::::::::::::::::::::::::::::::::::|:i |!:i:i:i:i:i:i:i:}:i:i:i:i:i:i:i:i:ｉ/∧ } .:i:i:i:i:i:i:i:i:ｉ:/:i:i:i:i:i:iﾔﾆﾆﾔﾆﾆ=- -=ニﾆ| |::::::::::::::::::::::::::::::::: |:i |!:i:i:i:i:i:i:i:i:i:i:i:i:i:i:i:i:i:i:/∧ ′ .:i:i:i:i:i:i:i:ｉ:ｉ:/:i:i:i:i:i:i:i:iﾔﾆﾆﾔ::::::::￣￣::::::::::| |::::::::::::::::::::::::::::::::::|:i:i|!:i:i:i:i:i:i:i:i:i:i:i:i:i:i:i:i:i:i:i:/∧ . /:i:i:i:i:i:i:i:i:i/:i:i:i:i:/:i:i:i:iﾔﾆﾆﾔ::::::::::::::::::::::::::::|:ﾔ:::::::::::::::::::::::::::::: |:i:ｉ|!:i:i:i:i:i:i:i:i:i:i:i:i:}!:i:i:i:i:i:i:i:i:/, /:i:i:i:i:i:i:i:i:i: :i:i:i:ｉ:/:i:i:i:i/:ﾔﾆﾆﾔ:::::::::::::::::::::::::::|:iﾔ ::::::::::::::::::::::::::: |:i: |!:i:i:i:}:i:i:i:i:i:i:i:i:}!:i:i:i:i: ､:i:i:i:} . /:i:i:i:i:i:i:i:i:i:i:i{:i:ｉ:ｉ/:i:i:i:i/:ｉ:ｉﾔﾆﾆﾔﾆ=- -=ニﾆ|:i:ﾔ:::::::::::::::::::::::::::::|:ｉ/|!:i:i:i:}:i:i:i:i:i:i:i:i:}!:i:i:i:ｉ} V/:} ﾞ:i:i:i:i:i:/:i:ｉ: {:i{:i:ｉ/ :i:i:ｉ/:i:i:i:i::寸ﾆﾔ:::: ￣￣ :::::::|:/‘,::::::::::::::::::::::::::::|/ :i:i:i:/:i:i:i:ｉ,ﾞ }:ｉ:}!:i:i:i:i:} /:i:i/ {:i:i:i:／{:i:i:i: {:i:i:i:{ :i:i ﾞ:i:i:i:i: .:i:ｉ:ｉ:ｉ:‘,::::::::::::::::::::::::| ‘,::::::::::::::::::::::::::| /:i:ｉ/:i:i:i:i:/ }:i:,ﾞ:i:i:i:i:ﾚi:／ {:i:i/ {:i:i:ｉ: {:i:i:i:i :i:i:{:i:i:i:i .:i:i:ｉ:ｉ:/ ‘,::::::::::::::::::::::| ‘,::::::::::::::::::::::::| /:／:i:i:i:i:/ :i/:i:i:i:i:i／
복사용
미리보기
복사