틀:랜덤색: 두 판 사이의 차이
편집 요약 없음 |
편집 요약 없음 |
||
(다른 사용자 한 명의 중간 판 4개는 보이지 않습니다) | |||
1번째 줄: | 1번째 줄: | ||
<onlyinclude>hsla({{{1|{{{색상|{{rand|0|360}}}}}}}},{{{2|{{{채도|{{rand|0|100}}%}}}}}},{{{3|{{{명도|{{rand|0|100}}%}}}}}},{{{4|{{{투명도|1}}}}}})</onlyinclude> | {{#invoke:IIFE|<nowiki>{{색깔|{{{1}}}|{{{1}}}}}</nowiki>|<onlyinclude>hsla({{{1|{{{색상|{{rand|0|360}}}}}}}},{{{2|{{{채도|{{rand|0|100}}%}}}}}},{{{3|{{{명도|{{rand|0|100}}%}}}}}},{{{4|{{{투명도|1}}}}}})</onlyinclude>}} | ||
__NOCACHE__ | __NOCACHE__ | ||
색상, 채도, 명도, 투명도를 임의 설정할 수 있는 hsv기반 랜덤색을 반환합니다. | 색상, 채도, 명도, 투명도를 임의 설정할 수 있는 hsv기반 랜덤색을 반환합니다. | ||
11번째 줄: | 11번째 줄: | ||
<pre>{{랜덤색|색상=(색상)|채도=(채도)|명도=(명도)|투명도=(투명도)}}</pre> | <pre>{{랜덤색|색상=(색상)|채도=(채도)|명도=(명도)|투명도=(투명도)}}</pre> | ||
: 속성에 해당하는 키값을 주어 각 인자를 전달 할 수 있습니다 | : 속성에 해당하는 키값을 주어 각 인자를 전달 할 수 있습니다. | ||
=== 인자에 대한 상세한 설명 === | === 인자에 대한 상세한 설명 === | ||
21번째 줄: | 21번째 줄: | ||
== 예제 == | == 예제 == | ||
=== 붉은색 계열의 랜덤색 === | |||
{{예시|<nowiki>{{loop|<now</nowiki><nowiki>iki>{{색깔|예시 |{{랜덤색|색상=0}}}}</now</nowiki><nowiki>iki>|30|1|1}}</nowiki>}} | |||
{{loop|<nowiki>{{색깔| | === 파스텔 계열의 랜덤색 === | ||
다크모드에서는 정상적으로 보이지 않습니다. | |||
{{예시|<nowiki><div style="background:#000;">{{loop|<now</nowiki><nowiki>iki>{{색깔|예시 |{{랜덤색|채도=100%|명도=95%}}}}</now</nowiki><nowiki>iki>|30|1|1}}</div></nowiki>}} | |||
=== 가독성을 해치지 않는 랜덤색/랜덤배경색 === | |||
{{예시|<nowiki>{{loop|<now</nowiki><nowiki>iki>{{색깔|예시|{{랜덤색|명도={{rand|10|30}}%}}|{{랜덤색|명도={{rand|70|90}}%}}}}</now</nowiki><nowiki>iki>|30|1|1}}</nowiki>}} | |||
=== 가독성을 해치지 않는 랜덤색/랜덤배경색2 === | |||
{{예시|<nowiki>{{loop|<now</nowiki><nowiki>iki>{{색깔|예시|{{랜덤색|명도={{rand|70|100}}%}}|{{랜덤색|명도={{rand|0|30}}%}}}}</now</nowiki><nowiki>iki>|30|1|1}}</nowiki>}} | |||
== 도보시오 == | == 도보시오 == | ||
* [https://www.w3schools.com/colors/colors_hsl.asp https://www.w3schools.com/ - Colors HSL and HSLA] | * [https://www.w3schools.com/colors/colors_hsl.asp https://www.w3schools.com/ - Colors HSL and HSLA] | ||
* [[틀:밝은색]] | |||
* [[틀:어두운색]] | |||
[[분류:랜덤 틀]] | [[분류:랜덤 틀]] | ||
[[분류:색상 코드 틀]] | [[분류:색상 코드 틀]] |
2024년 6월 25일 (화) 21:40 기준 최신판
hsla(45,84%,11%,1)
색상, 채도, 명도, 투명도를 임의 설정할 수 있는 hsv기반 랜덤색을 반환합니다.
사용법[원본 편집]
문서를 로딩할때마다 다른 색이 나타나게 하려면 문서 첫부분에 __NOCACHE__
를 추가해야 합니다.
{{랜덤색}}
- 임의 색을 반환합니다.
{{랜덤색|(색상)|(채도)|(명도)|(투명도)}}
- 인자를 주어 각 요소를 고정시킬 수 있습니다.
{{랜덤색|색상=(색상)|채도=(채도)|명도=(명도)|투명도=(투명도)}}
- 속성에 해당하는 키값을 주어 각 인자를 전달 할 수 있습니다.
인자에 대한 상세한 설명[원본 편집]
실제 색상휠과 파레트 생성기에서 확인하시고 사용하시는게 좋습니다.
- 색상 : 0-360 사이의 값을 갖습니다.
- 채도 : 0%-100% 사이의 값을 갖습니다.
- 명도 : 0%-100% 사이의 값을 갖습니다.
- 투명도 : 0-1 사이의 값을 갖습니다.
예제[원본 편집]
붉은색 계열의 랜덤색[원본 편집]
code_blocks 코드
{{loop|<nowiki>{{색깔|예시 |{{랜덤색|색상=0}}}}</nowiki>|30|1|1}}
code
description 결과
예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시
파스텔 계열의 랜덤색[원본 편집]
다크모드에서는 정상적으로 보이지 않습니다.
code_blocks 코드
<div style="background:#000;">{{loop|<nowiki>{{색깔|예시 |{{랜덤색|채도=100%|명도=95%}}}}</nowiki>|30|1|1}}</div>
code
description 결과
예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시 예시
가독성을 해치지 않는 랜덤색/랜덤배경색[원본 편집]
code_blocks 코드
{{loop|<nowiki>{{색깔|예시|{{랜덤색|명도={{rand|10|30}}%}}|{{랜덤색|명도={{rand|70|90}}%}}}}</nowiki>|30|1|1}}
code
description 결과
예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시
가독성을 해치지 않는 랜덤색/랜덤배경색2[원본 편집]
code_blocks 코드
{{loop|<nowiki>{{색깔|예시|{{랜덤색|명도={{rand|70|100}}%}}|{{랜덤색|명도={{rand|0|30}}%}}}}</nowiki>|30|1|1}}
code
description 결과
예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시예시