| ์ผ | ์ | ํ | ์ | ๋ชฉ | ๊ธ | ํ |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 | ||
| 6 | 7 | 8 | 9 | 10 | 11 | 12 |
| 13 | 14 | 15 | 16 | 17 | 18 | 19 |
| 20 | 21 | 22 | 23 | 24 | 25 | 26 |
| 27 | 28 | 29 | 30 | 31 |
- ํ ๋ง์๋์ ํ
- ์ฝ๋ฉ์์
- UX๋์์ธ
- ์ ๊ทผ์ฑ
- ์๋ฐ์คํฌ๋ฆฝํธ
- preferscolorscheme
- ์คํฌ๋ฆฐ๋ฆฌ๋์ง์
- ํ๋ก ํธ์๋
- css๋ณ์
- ์น๋์์ธ
- ์น์ ๊ทผ์ฑ
- ๋ฐ์ํ์น
- JavaScript
- ์๋ฐ์คํฌ๋ฆฝํธ์ปดํฌ๋ํธ
- ์คํฌ๋กค์ ๋๋ฉ์ด์
- UIUX
- ๋คํฌ๋ชจ๋
- ์ธํฐ๋ ํฐ๋ธui
- ๋ฐ๋๋ผ์คํฌ๋ฆฝํธ
- ์นUI
- ๋คํฌ๋ชจ๋ํ ๊ธ
- uiux๋์์ธ
- ๋ก์ปฌ์คํ ๋ฆฌ์ง
- ์นui๋์์ธ
- ui์ปดํฌ๋ํธ
- ๋ฐ๋๋ผjs
- css์ ๋๋ฉ์ด์
- ์๋ฐ์คํฌ๋ฆฝํธui
- js์คํฌ๋กค์ด๋ฒคํธ
- ์น๊ฐ๋ฐ
- Today
- Total
๋ชฉ๋ก์์คํ ํ ๋ง (1)
UI Code Lab
๐ ์ด์์ฒด์ ํ
๋ง์ ๋ฐ๋ผ ์๋์ผ๋ก ๋ณํ๋ ์น UI – prefers-color-scheme ํ์ฉ ๊ฐ์ด๋
๋คํฌ ๋ชจ๋ ํ ๊ธ ๊ธฐ๋ฅ์ ์ฌ์ฉ์ ๋ง์ถค UX์ ์์์ ์ ๋๋ค. ํ์ง๋ง ์ฌ์ฉ์๊ฐ ๋ณ๋์ ์ค์ ์์ด๋ ์ด์์ฒด์ ์ ํ ๋ง์ ๋ง์ถฐ ์น์ฌ์ดํธ๊ฐ ์์ฐ์ค๋ฝ๊ฒ ๋ฐ์ํ๋ค๋ฉด ํจ์ฌ ๋ ์ง๊ด์ ์ธ ๊ฒฝํ์ ์ ๊ณตํ ์ ์์ต๋๋ค. ๋ฐ๋ก ์ฌ๊ธฐ์ ์์คํ ํ ๋ง ๊ฐ์ง ๊ธฐ๋ฅ์ด ๋ฑ์ฅํฉ๋๋ค. ์ด๋ฒ ํฌ์คํธ์์๋ prefers-color-scheme ๋ฏธ๋์ด ์ฟผ๋ฆฌ๋ฅผ ํ์ฉํ์ฌ ์ด์์ฒด์ ์ ๋ผ์ดํธ/๋คํฌ ์ค์ ์ ์๋์ผ๋ก ๊ฐ์งํ๊ณ , ์ด๋ฅผ ์ฌ์ฉ์ ์ค์ ๊ณผ ์กฐํฉํด ์์ฐ์ค๋ฝ๊ฒ ์ ํํ๋ ๋ก์ง์ ๊ตฌํํด๋ณผ ๊ฑฐ์์. โ ๊ตฌํ ๋ชฉํOS์ ๋ผ์ดํธ/๋คํฌ ๋ชจ๋ ์ํ ๊ฐ์ง์ฌ์ฉ์ ์ค์ ๊ณผ ์์คํ ์ค์ ์ ์ฐ์ ์์ ์ฒ๋ฆฌCSS ๋ณ์์ data-theme ์์ฑ์ ํ์ฉํ ์คํ์ผ ๋ณ๊ฒฝ๋ก์ปฌ ์คํ ๋ฆฌ์ง ์ ์ฅ์ ํตํ ์ฌ์ฉ์ ์ปค์คํฐ๋ง์ด์ง ๐ง CSS์์ ์์คํ ํ ๋ง ๊ฐ์งํ๊ธฐ ์ด์์ฒด์ ๊ฐ ๋คํฌ ๋ชจ๋๋ก ์ค์ ๋์ด ..