ImageColorPicker.com

ფერის კონტრასტის შემმოწმებელი

ტესტი წინა პლანისა და ფონის ფერების კონტრასტის კოეფიციენტზე, რათა უზრუნველყო ხელმისაწვდომობა.

შეამოწმეთ თქვენი ფერები

ტესტი ფერთა კომბინაციებზე, რათა დარწმუნდე, რომ ისინი აკმაყოფილებენ WCAG-ის ხელმისაწვდომობის სტანდარტებს ტექსტის წაკითხვადობისთვის.

3.65-ზე 1
კონტრასტი
ჩავარდა
ტექსტის შედეგი
ცუდი

შედარებული: #FFFFFF ფონზე #C15ECC

ტექსტი

16px, რეგულარული (400)

თვლება ჩვეულებრივ ტექსტად.

  • AA (WCAG 1.4.3): მინიმუმ 4.5:1

    0.85 მეტი სჭირდება

    ჩავარდა

  • AAA (WCAG 1.4.6): მინიმუმ 7:1

    3.35 მეტი სჭირდება

    ჩავარდა

UI კომპონენტები და გრაფიკა

ხატულები, ველების საზღვრები, ფოკუსის ინდიკატორები და სხვა ნაწილები, რომლებიც უნდა დაინახო ინტერფეისის გამოსაყენებლად.

  • AA (WCAG 1.4.11): მინიმუმ 3:1

    გავლილია
3.65 : 1. ტექსტი: ვერ გადის AA, ვერ გადის AAA. UI კომპონენტები: გადის.
როგორ ხდება შემოწმება
შედარებული ფერები (შერევის შემდეგ)
ტექსტი #FFFFFF ფონზე #C15ECC
შედარებითი ლუმინანსი
ტექსტი 1.0000, ფონი 0.2370
ფორმულა
(L1 + 0.05) / (L2 + 0.05) სადაც L1 არის უფრო ნათელი ფერის ლუმინანსი, ხოლო L2 უფრო მუქი ფერისა.
ზუსტი თანაფარდობა
3.6582 : 1, ჩვენებით 3.65 : 1. ნაჩვენები მნიშვნელობა მოკვეცილია და არ არის დამრგვალებული, ამიტომ ის არასდროს გამოიყურება უკეთესად, ვიდრე სინამდვილეშია. მოთხოვნას ზუსტი მნიშვნელობა ედარება.

ტექსტის ზომა: 16px, რეგულარული (400)

თვლება ჩვეულებრივ ტექსტად. დიდი ტექსტი არის მინიმუმ 24px (18pt), ან მინიმუმ 18.67px (14pt), როცა მუქია (სისქე 700 ან მეტი). ზომები ნაჩვენებია მოკვეცილად და არა დამრგვალებულად.

თვლება ჩვეულებრივ ტექსტად. დიდი ტექსტი არის მინიმუმ 24px (18pt), ან მინიმუმ 18.67px (14pt), როცა მუქია (სისქე 700 ან მეტი). ზომები ნაჩვენებია მოკვეცილად და არა დამრგვალებულად.

სწრაფი შესწორებები

Aa
წინასწარი ნახვის სათაური

სწრაფი ყავისფერი მელა ხტება ზარმაცი ძაღლის თავზე

პატარა ტექსტის მაგალითი (12px)

ტექსტი
#ffffff
ფონი
#c15ecc

WCAG სტანდარტები

დონე AA

მინიმალური კონტრასტი 4.5:1 რეგულარული ტექსტისთვის და 3:1 დიდი ტექსტისთვის. საჭირო უმეტეს ვებსაიტებისთვის.

დონე AAA

გაძლიერებული კონტრასტი 7:1 რეგულარული ტექსტისთვის და 4.5:1 დიდი ტექსტისთვის. რეკომენდირებულია ოპტიმალური ხელმისაწვდომობისთვის.

ფერის კონტრასტის შემმოწმებელი

ტექსტისა და ფონის ფერების კონტრასტის კოეფიციენტის გამოთვლა.

აირჩიეთ ფერი ფერის არჩევანით ტექსტისა და ფონის ფერისთვის ან ჩაწერეთ ფერი RGB ჰექსადეციმალურად ფორმატში (მაგ., #259 ან #2596BE). შეგიძლიათ პარამეტრი გადააწიოთ ფერის ასარჩევად. ვებ კონტენტის ხელმისაწვდომობის სახელმძღვანელო (WCAG) ფერის კომბინაციებისთვის შედარებად შეფარდებებს მიიჩნევს. WCAG აცხადებს, რომ 4.5:1 ფერის კონტრასტი ტექსტთან და ფონსთან საკმარისია რეგულარული ტექსტისთვის, ხოლო დიდი ტექსტისთვის საჭიროა სულ მცირე 3:1 ფერის კონტრასტი.

ძირითადი მახასიათებლები

  • კონტრასტის კოეფიციენტის რეალურ დროში გამოთვლა
  • WCAG AA & AAA შესაბამისობის შემოწმება
  • HSL სლაიდერები ზუსტი რეგულირებისთვის
  • მრავალჯერადი წინასწარი გადახედვის ფორმატები

გაფართოებული ინსტრუმენტები

  • ავტომატური ფერის შესწორება
  • ტექსტისა და ფონის ნიმუშები
  • ფერის სახელის ამოცნობა
  • შედეგების ექსპორტი

ხშირად დასმული კითხვები

WCAG AA შესაბამისობისთვის ჩვეულებრივ ტექსტს სჭირდება მინიმუმ 4.5:1 კონტრასტის კოეფიციენტი, დიდ ტექსტს (18pt ან თამამი 14pt) კი 3:1.

WCAG AAA მოითხოვს უფრო მაღალ კონტრასტის კოეფიციენტებს: ჩვეულებრივი ტექსტისთვის 7:1 და დიდი ტექსტისთვის 4.5:1, AA-სთვის შესაბამისად 4.5:1 და 3:1.

გამოიყენეთ ავტომატური შესწორების ფუნქცია ტექსტის ან ფონის ფერის დასარეგულირებლად, დიზაინის ჩანაფიქრის შენარჩუნებით, ან ხელით დაარეგულირეთ ფერები HSL სლაიდერებით, რომლებიც AA/AAA შესაბამისობის ოპტიმალურ ზონებს აჩვენებს.

მწვანე ზონები და AA/AAA მარკერები აჩვენებს WCAG შესაბამისობის მისაღწევად ოპტიმალურ დიაპაზონებს. მიმართულების მინიშნებები (უფრო ღია/უფრო მუქი) გაძლევთ მითითებას, როგორ გააუმჯობესოთ კონტრასტი თქვენი ფერების მიმდინარე კომბინაციის მიხედვით.

დიახ, შეგიძლიათ შეიყვანოთ ნებისმიერი HEX კოდი ან აირჩიოთ ფერები ფერის ამრჩევით. URL ავტომატურად განახლდება, რათა შეძლოთ კონკრეტული ფერების კომბინაციის გაზიარება.