Visual Design Quick Test์˜ ์ƒํ’ˆ ๋กœ๊ณ  ์ด๋ฏธ์ง€

Visual Design Quick Test

ํ™•์žฅ ํ”„๋กœ๊ทธ๋žจ๊ฐœ๋ฐœ์ž ๋„๊ตฌ5 ์‚ฌ์šฉ์ž
Visual Design Quick Test์˜ ํ•ญ๋ชฉ ๋ฏธ๋””์–ด 1(์Šคํฌ๋ฆฐ์ƒท)

๊ฐœ์š”

ํ•„ํ„ฐ๋ฅผ ์‰ฝ๊ฒŒ ์ ์šฉํ•˜์—ฌ ์‚ฌ์ดํŠธ ๋˜๋Š” ํŒŒ์ผ์˜ ์‹œ๊ฐ์  ๋””์ž์ธ ํ…Œ์ŠคํŠธ

Quickly simulate visual conditions on any webpage โ€” blur, grayscale, horizontal/vertical flip, and six color blindness types. A lightweight toolkit for designers and developers to spot color contrast and accessibility issues without leaving the browser.

5์  ๋งŒ์ ์— 0์ ํ‰์  ์—†์Œ

๊ฒ€์ƒ‰๊ฒฐ๊ณผ ๋ฐ ๋ฆฌ๋ทฐ์— ๊ด€ํ•ด ์ž์„ธํžˆ ์•Œ์•„๋ณด๊ธฐ

์„ธ๋ถ€์ •๋ณด

  • ๋ฒ„์ „
    1.0.6
  • ์—…๋ฐ์ดํŠธ๋จ
    2026๋…„ 4์›” 18์ผ
  • ์ œ๊ณต
    Adam Ruf
  • ํฌ๊ธฐ
    4.32MiB
  • ์–ธ์–ด
    ์–ธ์–ด 12๊ฐœ
  • ๊ฐœ๋ฐœ์ž
    ์ด๋ฉ”์ผ
    adam@adamruf.com
  • ๋น„ํŒ๋งค์ž
    ํŒ๋งค์ž๋กœ ์‹๋ณ„๋˜์ง€ ์•Š์€ ๊ฐœ๋ฐœ์ž์ž…๋‹ˆ๋‹ค. ์œ ๋Ÿฝ ์—ฐํ•ฉ์— ๊ฑฐ์ฃผํ•˜๋Š” ์†Œ๋น„์ž์˜ ๊ฒฝ์šฐ, ์ด ๊ฐœ๋ฐœ์ž์™€ ์ฒด๊ฒฐํ•œ ๊ณ„์•ฝ์— ๋Œ€ํ•ด์„œ๋Š” ์†Œ๋น„์ž ๊ถŒ๋ฆฌ๊ฐ€ ์ ์šฉ๋˜์ง€ ์•Š์„ ์ˆ˜ ์žˆ์Œ์„ ์œ ์˜ํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค.

๊ฐœ์ธ์ •๋ณด ๋ณดํ˜ธ

ํ™•์žฅ ํ”„๋กœ๊ทธ๋žจ์„ ๊ด€๋ฆฌํ•˜๊ณ  ์กฐ์ง์—์„œ ํ™•์žฅ ํ”„๋กœ๊ทธ๋žจ์ด ์‚ฌ์šฉ๋˜๋Š” ๋ฐฉ์‹์„ ์•Œ์•„๋ณด์„ธ์š”.
๊ฐœ๋ฐœ์ž๊ฐ€ ๋ฐ์ดํ„ฐ๋ฅผ ์ˆ˜์ง‘ํ•˜๊ฑฐ๋‚˜ ์‚ฌ์šฉํ•˜์ง€ ์•Š๊ฒ ๋‹ค๊ณ  ๋ช…์‹œํ–ˆ์Šต๋‹ˆ๋‹ค.

๊ฐœ๋ฐœ์ž๊ฐ€ ์‚ฌ์šฉ์ž ๋ฐ์ดํ„ฐ์— ๊ด€ํ•ด ๋‹ค์Œ๊ณผ ๊ฐ™์ด ์„ ์–ธํ–ˆ์Šต๋‹ˆ๋‹ค

  • ์Šน์ธ๋œ ์‚ฌ์šฉ ์‚ฌ๋ก€๋ฅผ ์ œ์™ธํ•˜๊ณ  ์„œ๋“œ ํŒŒํ‹ฐ์— ํŒ๋งคํ•˜์ง€ ์•Š์Œ
  • ํ•ญ๋ชฉ์˜ ํ•ต์‹ฌ ๊ธฐ๋Šฅ๊ณผ ๊ด€๋ จ ์—†๋Š” ๋ชฉ์ ์œผ๋กœ ์‚ฌ์šฉํ•˜๊ฑฐ๋‚˜ ์ „์†กํ•˜์ง€ ์•Š์Œ
  • ์‹ ์šฉ๋„ ํŒ๋‹จ ๋˜๋Š” ๋Œ€์ถœ ๋ชฉ์ ์œผ๋กœ ์‚ฌ์šฉํ•˜๊ฑฐ๋‚˜ ์ „์†กํ•˜์ง€ ์•Š์Œ

์ง€์›

๊ด€๋ จ ํ•ญ๋ชฉ

Metis

0.0

A lightweight design tool for checking layouts in your browser. Measure elements, drop guides and see gaps.

Color Blind Mode

5.0

Apply color-blind-friendly filters to any webpage.

Website CSS and Style Extractor

5.0

Inspect the design system of any webpage and export its style tokens for reuse in your own projects.

Color Inverter

5.0

Apply color inversion filter by page or by selection to increase visibility of selected item.

่‰ฒๅผฑ่‰ฒๅฝฉๅขžๅผบๅ™จ

5.0

ๅฎžๆ—ถๅบ”็”จ CSS ๆปค้•œ๏ผŒๅธฎๅŠฉ่‰ฒๅผฑ่‰ฒ็›ฒ็พคไฝ“ๆ›ดๆธ…ๆ™ฐๅœฐๆต่งˆ็ฝ‘้กตใ€‚

Guide lines

4.3

Easily check the visual alignment of the page elements.

FontViz: Inspect fonts with ease

5.0

Easily inspect and validate the fonts used on any website or web application

CSS Scanner Pro

5.0

The fastest and easiest way to inspect, copy and analyze CSS styles on any webpage

VisuPalette - Color Palette Extractor & Theme Generator

0.0

Extract color palettes from websites with eyedropper, area capture, and instant theme preview.

์ƒ‰์ƒ ์„ ํƒ๊ธฐ ๋ฐ ์Šคํฌ์ด๋“œ ๋„๊ตฌ

4.8

์Šคํฌ์ด๋“œ ๋„๊ตฌ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์›น์‚ฌ์ดํŠธ์—์„œ ์ƒ‰์ƒ์„ ์„ ํƒํ•˜์„ธ์š”. ๊ทธ๋ผ๋ฐ์ด์…˜, ์ƒ‰์ƒ ํŒ”๋ ˆํŠธ๋ฅผ ์ƒ์„ฑํ•˜๊ณ  HEX ๋˜๋Š” RGB ๊ฐ’์„ ์ฆ‰์‹œ ๋ณต์‚ฌํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

Colorblind Vision Extension

4.0

Apply colorblind filters to all tabs except chrome tabs like chrome://.......

Inspektr

0.0

Inspect fonts, capture screens, and diagnose webpages. A developer toolkit for web designers and engineers.

Metis

0.0

A lightweight design tool for checking layouts in your browser. Measure elements, drop guides and see gaps.

Color Blind Mode

5.0

Apply color-blind-friendly filters to any webpage.

Website CSS and Style Extractor

5.0

Inspect the design system of any webpage and export its style tokens for reuse in your own projects.

Color Inverter

5.0

Apply color inversion filter by page or by selection to increase visibility of selected item.

่‰ฒๅผฑ่‰ฒๅฝฉๅขžๅผบๅ™จ

5.0

ๅฎžๆ—ถๅบ”็”จ CSS ๆปค้•œ๏ผŒๅธฎๅŠฉ่‰ฒๅผฑ่‰ฒ็›ฒ็พคไฝ“ๆ›ดๆธ…ๆ™ฐๅœฐๆต่งˆ็ฝ‘้กตใ€‚

Guide lines

4.3

Easily check the visual alignment of the page elements.

FontViz: Inspect fonts with ease

5.0

Easily inspect and validate the fonts used on any website or web application

CSS Scanner Pro

5.0

The fastest and easiest way to inspect, copy and analyze CSS styles on any webpage

Google ์•ฑ