틀:명도

시각위키텍스트

2024년 5월 19일 (일) 22:21 판 (원본 보기) Kimchan (토론 | 기여) 편집 요약 없음 ← 이전 편집		2025년 4월 19일 (토) 09:36 판 (원본 보기) Kimchan (토론 | 기여) 편집 요약 없음 다음 편집 →
1번째 줄:		1번째 줄:
	{{namucat|김찬/제작한 틀}}		{{namucat|김찬/제작한 틀}}
	{{틀 도움}}		{{틀 도움
	<onlyinclude><div style="width: 100%; margin: .8rem 0; text-align: center;"><span style="padding: 4px; padding-top: 8px; border-radius: 5px; background: #{{{1|ff0000}}}; color: {{글자색계산|#{{{1|ff0000}}}}};">'''{{++5|{{#tag:nowiki|#}}{{대문자:{{{1|ff0000}}}}}}}'''</span></div><!--		|날짜1='''25.04.19'''|업데이트1=모듈을 이용해 단계별 헥스 코드 출력
	--><div style="width: 100%; margin: .8rem 0;"><!--		}}
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">0%</div><!--		<onlyinclude>{|{{style|class=wiki|table=center|border=#{{{1|ff0000}}}|align=center}}
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">10%</div><!--		|-
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">20%</div><!--		|{{style|colspan=2|bg=#{{{1|ff0000}}}|color={{글자색계산|#{{{1|ff0000}}}}}}}|'''{{++5|{{#tag:nowiki|#}}{{대문자:{{{1|ff0000}}}}}}}'''
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">30%</div><!--		|-
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">40%</div><!--		|{{style|width=50%|bg=header|vertical=top}}|{{펼접|id=brightness-template-darken|title=[ Darken ]}}
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">50%</div><!--		|-
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">60%</div><!--		|0%
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">70%</div><!--		|{{style|width=2em|bg={{bgbt|#{{{1|ff0000}}}|black|0}}}}|
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">80%</div><!--		|{{#tag:nowiki|#}}{{대문자:{{{1|ff0000}}}}}
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">90%</div><!--		|-
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">100%</div><!--		|10%
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; border-radius: 5px 0 0 5px; background: {{bgbt|#{{{1|ff0000}}}|black|0}};"></div><!--		|{{style|bg={{bgbt|#{{{1|ff0000}}}|black|10}}}}|
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|black|10}};"></div><!--		|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|darken|10%}}}}
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|black|20}};"></div><!--		|-
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|black|30}};"></div><!--		|20%
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|black|40}};"></div><!--		|{{style|bg={{bgbt|#{{{1|ff0000}}}|black|20}}}}|
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|black|50}};"></div><!--		|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|darken|20%}}}}
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|black|60}};"></div><!--		|-
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|black|70}};"></div><!--		|30%
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|black|80}};"></div><!--		|{{style|bg={{bgbt|#{{{1|ff0000}}}|black|30}}}}|
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|black|90}};"></div><!--		|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|darken|30%}}}}
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; border-radius: 0 5px 5px 0; background: {{bgbt|#{{{1|ff0000}}}|black|100}};"></div></div><!--		|-
	--><div style="width: 100%; margin: .8rem 0;"><!--		|40%
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">0%</div><!--		|{{style|bg={{bgbt|#{{{1|ff0000}}}|black|40}}}}|
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">10%</div><!--		|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|darken|40%}}}}
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">20%</div><!--		|-
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">30%</div><!--		|50%
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">40%</div><!--		|{{style|bg={{bgbt|#{{{1|ff0000}}}|black|50}}}}|
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">50%</div><!--		|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|darken|50%}}}}
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">60%</div><!--		|-
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">70%</div><!--		|60%
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">80%</div><!--		|{{style|bg={{bgbt|#{{{1|ff0000}}}|black|60}}}}|
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">90%</div><!--		|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|darken|60%}}}}
	--><div style="display: inline-block; width: {{#expr:100/11}}%; text-align: center;">100%</div><!--		|-
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; border-radius: 5px 0 0 5px; background: {{bgbt|#{{{1|ff0000}}}|white|0}};"></div><!--		|70%
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|white|10}};"></div><!--		|{{style|bg={{bgbt|#{{{1|ff0000}}}|black|70}}}}|
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|white|20}};"></div><!--		|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|darken|70%}}}}
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|white|30}};"></div><!--		|-
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|white|40}};"></div><!--		|80%
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|white|50}};"></div><!--		|{{style|bg={{bgbt|#{{{1|ff0000}}}|black|80}}}}|
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|white|60}};"></div><!--		|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|darken|80%}}}}
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|white|70}};"></div><!--		|-
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|white|80}};"></div><!--		|90%
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; background: {{bgbt|#{{{1|ff0000}}}|white|90}};"></div><!--		|{{style|bg={{bgbt|#{{{1|ff0000}}}|black|90}}}}|
	--><div style="display: inline-block; width: {{#expr:100/11}}%; height: 30px; border-radius: 0 5px 5px 0; background: {{bgbt|#{{{1|ff0000}}}|white|100}};"></div></div></onlyinclude>		|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|darken|90%}}}}
			|-
			|100%
			|{{style|bg=#000000}}|
			|#000000
			{{펼접끝}}
			|{{style|width=50%|bg=header|vertical=top}}|{{펼접|id=brightness-template-brighten|title=[ brighten ]}}
			|-
			|0%
			|{{style|width=2em|bg={{bgbt|#{{{1|ff0000}}}|white|0}}}}|
			|{{#tag:nowiki|#}}{{대문자:{{{1|ff0000}}}}}
			|-
			|10%
			|{{style|bg={{bgbt|#{{{1|ff0000}}}|white|10}}}}|
			|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|brighten|10%}}}}
			|-
			|20%
			|{{style|bg={{bgbt|#{{{1|ff0000}}}|white|20}}}}|
			|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|brighten|20%}}}}
			|-
			|30%
			|{{style|bg={{bgbt|#{{{1|ff0000}}}|white|30}}}}|
			|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|brighten|30%}}}}
			|-
			|40%
			|{{style|bg={{bgbt|#{{{1|ff0000}}}|white|40}}}}|
			|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|brighten|40%}}}}
			|-
			|50%
			|{{style|bg={{bgbt|#{{{1|ff0000}}}|white|50}}}}|
			|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|brighten|50%}}}}
			|-
			|60%
			|{{style|bg={{bgbt|#{{{1|ff0000}}}|white|60}}}}|
			|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|brighten|60%}}}}
			|-
			|70%
			|{{style|bg={{bgbt|#{{{1|ff0000}}}|white|70}}}}|
			|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|brighten|70%}}}}
			|-
			|80%
			|{{style|bg={{bgbt|#{{{1|ff0000}}}|white|80}}}}|
			|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|brighten|80%}}}}
			|-
			|90%
			|{{style|bg={{bgbt|#{{{1|ff0000}}}|white|90}}}}|
			|{{nowiki|{{#invoke:AdjustBrightness|adjust|#{{{1|ff0000}}}|brighten|90%}}}}
			|-
			|100%
			|{{style|bg=#FFFFFF}}|
			|#FFFFFF
			{{펼접끝}}
			|}</onlyinclude>
	<pre>{{명도|<색상>}}</pre>		<pre>{{명도|<색상>}}</pre>
	입력한 색상의 명도를 10% 단위로 조절하여 보여줍니다. 안타깝게도 밝고 어두워지는 단계별 색상 코드를 따로 알 수는 없습니다. {{--|진짜 그냥 보여주기만 합니다}}		입력한 색상의 명도를 10% 단위로 조절하여 보여줍니다.
	변수에는 헥스코드 6자리의 '''숫자만''' 입력해야 합니다. 나머지는 인식되지 않습니다.		변수에는 헥스코드 6자리의 '''숫자만''' 입력해야 합니다. 나머지는 인식되지 않습니다.
	{{김찬 제작 틀}}		{{김찬 제작 틀}}

---

2025년 4월 19일 (토) 09:36 판

분류:

김찬/제작한 틀

틀:명도
사용문서
넘겨주기	이동하기
2025-04-19에 마지막으로 수정됨

[ 주요 업데이트 노트 ] 25.04.19 모듈을 이용해 단계별 헥스 코드 출력

---

#FF0000
[ Darken ] 0% #FF0000 10% #E50000 20% #CC0000 30% #B20000 40% #990000 50% #7F0000 60% #660000 70% #4C0000 80% #330000 90% #190000 100% #000000	[ brighten ] 0% #FF0000 10% #FF1919 20% #FF3333 30% #FF4C4C 40% #FF6666 50% #FF7F7F 60% #FF9999 70% #FFB2B2 80% #FFCCCC 90% #FFE5E5 100% #FFFFFF

{{명도|<색상>}}

입력한 색상의 명도를 10% 단위로 조절하여 보여줍니다.

변수에는 헥스코드 6자리의 숫자만 입력해야 합니다. 나머지는 인식되지 않습니다.

+ 김찬 제작 틀
[ A~Z & etc. ] etc. 틀:,, 틀:-- 틀:--2 틀:^^ 틀:?div A~M 틀:background-image 틀:bg 틀:BMI 틀:center 틀:cursor 틀:DDAY 틀:div 틀:ffms 틀:font awesome 5 틀:full block 틀:gradient-ex 틀:hex to rgb 틀:invert-img 틀:jp 틀:leet 틀:librecat 틀:list margin remove 틀:MBTI N~Z 틀:namucat 틀:namulist 틀:namutoc 틀:nowiki 틀:nowiki2 틀:ol 틀:onbold 틀:PC 열람 권장 틀:pf-c 틀:pre 틀:rgb to hex 틀:rotate 틀:selflink 틀:snowfalling 틀:span 틀:style 틀:syntaxhighlight 틀:thumbs 틀:title 틀:tp 틀:tt 틀:u 틀:widen 틀:wingdings [ ㄱ~ㅅ ] ㄱ 틀:가로 목록 틀:가로세로비 틀:가로줄 틀:가입일 유저박스 틀:가짜 링크 틀:가짜 문단 틀:갤러리 (김찬) 틀:공백 틀:관련 문서 틀 제목 틀:광과민성 주의 틀:군대 유저박스 (상세) 틀:굵게 틀:그라데이션 글씨 틀:글리치 틀:글배경 틀:글씨 테두리 ㄴ 틀:나무링크 틀:나무마크 틀 틀:나무위키 둘러보기 틀:나무위키 접기 틀:나무위키 접기2 (제목 / 내용) 틀:나무위키 테이블 틀:나무위키 텍스트 크기 틀:나무위키 틀 접기 (애니메이션) 틀:나무위키 틀 접기 끝 틀:나무위키식 문서 상태 틀 틀:내비게이션 바 색상 틀:너비맞춤 틀:넘겨주기 틀:넘겨주기 안내 틀:네온 글씨 ㄷ 틀:다크모드 틀:대화담벼락 틀:댓글 금지 틀:둥근 이미지 틀:등급 유저박스 ㄹ 틀:루비 문자 ㅁ 틀:막대 그래프 틀:말풍선 틀:말풍선 각주 (버튼 / 내용 / 시작 / 끝) 틀:메타 분류 틀:메타 틀 틀:명도 틀:모바일 테이블 (/tag) 틀:모바일 테이블 끝 (/tag) 틀:목차제거 틀:문단 틀:문단접기 틀:문단접기2 틀:문단접기3 틀:문서 가져옴 틀:문서 보충 틀:미공개 틀:미디어위키 접기 V2 틀:밑줄 없는 링크 ㅂ 틀:반복 틀:반응형 style 틀:반전 틀:반전2 틀:배경색 명도 조절 틀:백분율 틀:버튼 틀:별점 틀:복사방지 틀:부계정 유저박스 틀:분류 바로가기 틀:분류앵커 틀:불법2 틀:블러2 틀:블러3 틀:블러4 틀:블링크 틀:비공식 설정 틀:빈 이미지 ㅅ 틀:사건사고 틀:산문적 문서 틀:상징색 틀:색상 수평줄 틀:성적 요소 틀:세계관 무관 틀:세계관 별점 틀:소설 (시작 / 끝 / 버튼 / 클립보드) 틀:소셜 프로필 틀:소속단체 유저박스 틀:수평줄 꾸미기 틀:순차형3 틀:스포일러 강조 틀:실루엣 틀:씹덕주의 [ ㅇ~ㅎ ] ㅇ 틀:안내문 틀:알림창 틀:오류창 틀:외부 라이선스 틀:외부링크숨김 틀:원형 그래프 틀:유저박스 틀 틀:이미지 가림 틀:이미지 넣기 (/tag) 틀:이미지 변화 틀:이미지 여백 제거 틀:인용문D 틀:인용문N → 틀:인용문1 틀:인용문SCP 틀:인용문W ㅈ 틀:접기변화 틀:조사 틀:주의 가림막 틀:줄바꿈 ㅊ 틀:체크리스트 ㅋ 틀:커스텀 목록 틀:코드 예제 틀:코드 예제 끝 ㅌ 틀:테두리 그라데이션 틀:텍스트 가림 틀:툴팁 틀:툴팁2 틀:틀 도움 ㅍ 틀:파일 틀:팬그램 틀:펼치기 접기/multi (제목 / 내용) 틀:폰트 틀:폴리비오스 암호 틀:표 안의 표 ㅎ 틀:하위 문서3 틀:하이라이트 틀:혐오적 요소 틀:호감도 틀:흑백
※ 더 이상 사용하지 않거나 사용할 필요가 없는 경우 취소선 처리 ※ 일부 극히 단순한 틀은 본 틀 목록에 미포함