사용자
nyangx3/a(비교)
| r123 vs r124 | ||
|---|---|---|
| ... | ... | |
| 2095 | 2095 | }}}}}} |
| 2096 | 2096 | * |
| 2097 | 2097 | }}} |
| 2098 | {{{#! | |
| 2099 | ||
| 2100 | ||
| 2101 | ||
| 2102 | ||
| 2103 | ||
| 2104 | * | |
| 2105 | ||
| 2106 | ||
| 2107 | ||
| 2108 | ||
| 2109 | ||
| 2110 | ||
| 2111 | ||
| 2112 | ||
| 2113 | ||
| 2114 | ||
| 2115 | ||
| 2116 | ||
| 2117 | ||
| 2118 | ||
| 2119 | ||
| 2120 | ||
| 2121 | ||
| 2122 | ||
| 2123 | l | |
| 2124 | ||
| 2125 | ||
| 2126 | {{{#!i | |
| 2127 | ||
| 2128 | ||
| 2129 | ||
| 2130 | {{{#!wiki style="@a@ in srgb @b@" | |
| 2098 | * 그라디엔트 관련{{{#!if a='text-align: center; margin: 7.5px 0; padding: 5px; border-radius: 8px; color: #fff; font-size: .8em; font-weight: bold; background: linear-gradient(to right'; b=', #5211EE, #ADEE11)' | |
| 2099 | }}}{{{#!wiki style="margin-left: -25px" | |
| 2100 | ## display-p3-linear x? | |
| 2101 | * 그라디엔트를 만들 때 기본 색 공간에서 만들면 보기 좋지 않은 결과물이 나올 확률이 높다. 특히 보색을 사용하거나 여러 색상을 사용할 때 이런 현상이 많이 일어나는데, 이럴 때 {{{#!wiki style="display: inline; background: #bfe9d5; letter-spacing: -.5px; border-radius: .25rem; padding: .125rem .25rem .2rem; font-size: clamp(.65em, 1.5vw, .75em); max-width: fit-content; font-family: Consolas,monospace" dark-style="background: #383c45" | |
| 2102 | linear-gradient(to right '''in <색공간명>''', 색상1, 색상2)}}} 형식으로 색 공간을 다르게 정의하여 보통 더 나은 결과물을 얻을 수 있다. | |
| 2103 | 아래는 보색 관계인 보라색과 초록색의 색 공간별 그라디엔트 예시이다.{{{#!wiki style="@a@ @b@" | |
| 2104 | normal}}}{{{#!wiki style="@a@ in srgb-linear @b@" | |
| 2105 | (to right in srgb-linear@b@}}}{{{#!wiki style="@a@ in lab @b@" | |
| 2106 | (to right in lab@b@}}}{{{#!wiki style="@a@ in oklab @b@" | |
| 2107 | (to right in oklab@b@}}}{{{#!wiki style="@a@ in lch @b@" | |
| 2108 | (to right in lch@b@}}}{{{#!wiki style="@a@ in oklch @b@" | |
| 2109 | (to right in oklch@b@}}} | |
| 2110 | * color-interpolation-method: {{{-2 사용 가능한 색 공간}}}{{{#!wiki style="font-size: .75rem" | |
| 2111 | {{{#!folding [ 펼치기 · 접기 ] | |
| 2112 | {{{#!wiki style="font-size: 1.1em" | |
| 2113 | {{{#!wiki | |
| 2114 | * rectangular-color-space}}}{{{#!wiki style="@a@ in srgb @b@" | |
| 2131 | 2115 | (to right in srgb@b@}}}{{{#!wiki style="@a@ in srgb-linear @b@" |
| 2132 | 2116 | (to right in srgb-linear@b@}}}{{{#!wiki style="@a@ in display-p3 @b@" |
| 2133 | 2117 | (to right in display-p3@b@}}}{{{#!wiki style="@a@ in a98-rgb @b@" |
| ... | ... | |
| 2135 | 2119 | (to right in prophoto-rgb@b@}}}{{{#!wiki style="@a@ in rec2020 @b@" |
| 2136 | 2120 | (to right in rec2020@b@}}}{{{#!wiki style="@a@ in lab @b@" |
| 2137 | 2121 | (to right in lab@b@}}}{{{#!wiki style="@a@ in oklab @b@" |
| 2138 | (to right in oklab@b@}}} | |
| 2139 | ||
| 2140 | ||
| 2141 | {{{#!wiki style="@a@ in xyz @b@" | |
| 2122 | (to right in oklab@b@}}}{{{#!wiki | |
| 2123 | * xyz-space}}}{{{#!wiki style="@a@ in xyz @b@" | |
| 2142 | 2124 | (to right in xyz@b@}}}{{{#!wiki style="@a@ in xyz-d50 @b@" |
| 2143 | 2125 | (to right in xyz-d50@b@}}}{{{#!wiki style="@a@ in xyz-d65 @b@" |
| 2144 | (to right in xyz-d65@b@}}} | |
| 2145 | ||
| 2146 | ||
| 2147 | {{{#!wiki style="@a@ in hsl @b@" | |
| 2126 | (to right in xyz-d65@b@}}}{{{#!wiki | |
| 2127 | * polar-color-space}}}{{{#!wiki style="@a@ in hsl @b@" | |
| 2148 | 2128 | (to right in hsl@b@}}}{{{#!wiki style="@a@ in hwb @b@" |
| 2149 | 2129 | (to right in hwb@b@}}}{{{#!wiki style="@a@ in lch @b@" |
| 2150 | 2130 | (to right in lch@b@}}}{{{#!wiki style="@a@ in oklch @b@" |
| 2151 | (to right in oklch@b@}}} | |
| 2152 | * hue-interpolation-method{{{#!wiki style="font-size: .75rem" | |
| 2131 | (to right in oklch@b@}}}}}}}}}}}} | |
| 2132 | * hue-interpolation-method: {{{-2 polar-color-space(hsl, hwb, lch, oklch)에서만 사용 가능.}}}{{{#!wiki style="font-size: .75rem" | |
| 2153 | 2133 | {{{#!folding [ 펼치기 · 접기 ] |
| 2154 | 2134 | {{{#!wiki style="font-size: 1.1em" |
| 2155 | 2135 | {{{#!wiki |
| 2136 | * 유효한 값: shorter hue, longer hue, increasing hue, decreasing hue}}}{{{#!wiki | |
| 2156 | 2137 | * hsl}}}{{{#!wiki style="@a@ in hsl longer hue, red, blue)" |
| 2157 | 2138 | in hsl longer hue, red, blue}}}{{{#!wiki style="@a@ in hsl increasing hue, red, blue)" |
| 2158 | 2139 | in hsl increasing hue, red, blue}}}{{{#!wiki style="@a@ in hsl shorter hue, red, blue)" |
| ... | ... | |
| 2167 | 2148 | * 🌈}}}{{{#!wiki style="@a@ in hsl longer hue, red, red)" |
| 2168 | 2149 | in hsl longer hue, red, red}}}{{{#!wiki style="@a@ in lch longer hue, red, red)" |
| 2169 | 2150 | in lch longer hue, red, red}}}{{{#!wiki style="@a@ in oklch longer hue, red, red)" |
| 2170 | in oklch longer hue, red, red}}}}}}}}}}}} | |
| 2151 | in oklch longer hue, red, red}}}}}}}}}}}}}}}{{{#!wiki style="margin-left: -25px" | |
| 2152 | * 토론 | |
| 2153 | * 빈 토론을 만들기 위해 {{{#!wiki @style1@ | |
| 2154 | \#\#}}}같은 주석 문법을 많이 사용하는데, 사실 {{{#!wiki @style1@ | |
| 2155 | \\}}} 한 글자로도 만들 수 있다.}}} | |
| 2156 | [anchor(계산기(위키 문법))][include(사용자:nyangx3/연습장, if=문단, 문단명=계산기(위키 문법), 문단번호=0)] | |
| 2157 | * if 문법으로 구현한 계산기이며, 특성상 소수점 계산 시 오류가 날 수 있다. 또한 | |
| 2158 | \[include(사용자:nyangx3/연습장, if=계산기, a=54321, f=+, b=12345)][include(사용자:nyangx3/연습장, if=계산기, a=54321, f=+, b=12345)]\[include(사용자:nyangx3/연습장, if=계산기, a=-741, f=-, b=147)][include(사용자:nyangx3/연습장, if=계산기, a=-741, f=-, b=147)]\[include(사용자:nyangx3/연습장, if=계산기, a=37, f=*, b=73)][include(사용자:nyangx3/연습장, if=계산기, a=37, f=*, b=73)]\[include(사용자:nyangx3/연습장, if=계산기, a=23, f=/, b=7)][include(사용자:nyangx3/연습장, if=계산기, a=23, f=/, b=7)]\[include(사용자:nyangx3/연습장, if=계산기, a=0, f=/, b=0)][include(사용자:nyangx3/연습장, if=계산기, a=0, f=/, b=0)]{{{#!folding [ 큰 수 계산기 펼치기 · 접기 ] | |
| 2159 | \[include(사용자:nyangx3/연습장, if=계산기, a=1.1, f=+, b=5.9)] | |
| 2160 | [include(사용자:nyangx3/연습장, if=계산기, a=1.1, f=+, b=5.9)] | |
| 2161 | \[include(사용자:nyangx3/연습장, if=계산기, a=-974, f=-, b=0)] | |
| 2162 | [include(사용자:nyangx3/연습장, if=계산기, a=-974, f=-, b=0)] | |
| 2163 | \[include(사용자:nyangx3/연습장, if=계산기, a=92233720368547758088, f=*, b=2)] | |
| 2164 | [include(사용자:nyangx3/연습장, if=계산기, a=92233720368547758088, f=*, b=2)] | |
| 2165 | \[include(사용자:nyangx3/연습장, if=계산기, a=1, f=/, b=0)] | |
| 2166 | [include(사용자:nyangx3/연습장, if=계산기, a=1, f=/, b=0)] | |
| 2167 | \[include(사용자:nyangx3/연습장, if=4)] | |
| 2168 | [include(사용자:nyangx3/연습장, if=4)]}}} | |
| 2169 | [anchor(나무나무마크)][include(사용자:nyangx3/연습장, if=문단, 문단명=나무나무마크, 문단번호=6)] | |
| 2170 | 내용내용내용 | |
| 2171 | [anchor(그 외3)][include(사용자:nyangx3/연습장, if=문단, 문단명=그 외3, 문단번호=7)] | |
| 2172 | * 스킨 판별기: 스킨마다 정의된 [[#CSS Custom Property|CSS Custom Property]]들이 다르다는 점을 이용하였다. 리버티 스킨의 경우 텍스트 컬러를 나타내는 고유의 변수명이 따로 없기에, -\-liberty-brand-bright-color로 설정하였으며, 이로 인해 다크 모드의 시인성이 매우 좋지 않다. display: var(--뭐시기, none) << 이거왜안됨 | |
| 2173 | 당신은{{{#!wiki style="color: transparent; font: 1em/0 monospace; font-family: revert; display: inline-table" | |
| 2174 | {{{#!wiki style="color: var(--espejo-text-color, inherit)" | |
| 2175 | espejo}}}{{{#!wiki style="color: var(--liberty-brand-bright-color, inherit)" | |
| 2176 | liberty}}}}}}스킨을 사용하고 있습니다. | |
| 2171 | 2177 | * 단계별 글자 크기 |
| 2172 | 2178 | 1em = espejo: 14.25px, liberty: 15px |
| 2173 | 2179 | ||<tablebgcolor=transparent><rowbgcolor=#00a495><rowcolor=#fff> 입력 || 출력 || 입력 || 출력 || |
| ... | ... | |
| 2178 | 2184 | || {{{+5 +5단계}}} ||1.66667em || {{{-5 -5단계}}} ||0.62222em || |
| 2179 | 2185 | {{{#!wiki style="display: none" |
| 2180 | 2186 | [각주]}}} |
| 2187 | ## env? |