Μετάβαση στο κύριο περιεχόμενο

Μετατροπέας χρωμάτων

Μετάτρεψε ανάμεσα σε hex, RGB, HSL, OKLCH και OKLAB, ελέγχοντας αντίθεση και εξάγοντας tokens έτοιμα για CSS.

Υποστηρίζει hex, rgb(), hsl(), oklch(), oklab() και named CSS colors.

Τρέχον χρώμα

#953769

Προτεινόμενο foreground

#FFFFFF

Συμπληρωματικό χρώμα

#007653

Hex
RGB(A)
HSL(A)
OKLCH
OKLAB
Alpha
Tailwind theme
Δημιούργησε πλήρη brand palette για Tailwind CSS 4 ή 3 από το τρέχον χρώμα.
50
oklch(94.5% 0.0212 350.46)
100
oklch(89.49% 0.0339 350.46)
200
oklch(81.48% 0.0542 350.46)
300
oklch(72.47% 0.0771 350.46)
400
oklch(61.46% 0.105 350.46)
500
oklch(48.44% 0.138 350.46)
600
oklch(43.57% 0.1236 350.46)
700
oklch(38.7% 0.1093 350.46)
800
oklch(33.22% 0.0932 350.46)
900
oklch(27.74% 0.077 350.46)
950
oklch(23.48% 0.0644 350.46)
CSS variables

Σχετικά με τη μετατροπή χρωμάτων CSS

Οι μετατροπείς χρωμάτων σε βοηθούν να μετακινείς το ίδιο χρώμα ανάμεσα σε HEX, RGB, HSL, OKLCH και OKLAB. Είναι πιο χρήσιμοι όταν χρειάζεσαι ευανάγνωστο αποτέλεσμα, πλαίσιο αντίθεσης και τιμές έτοιμες για CSS ή Tailwind.

HEX, RGB, HSL και χρώματα CSS

Τα HEX, RGB και HSL καλύπτουν τις περισσότερες καθημερινές ροές εργασίας σε browser, design και frontend.

Η γρήγορη μετατροπή σου επιτρέπει να επικολλήσεις μία τιμή και να τη χρησιμοποιήσεις παντού χωρίς να ξαναγράφεις τη σύνταξη με το χέρι.

Γιατί έχουν σημασία τα OKLCH και OKLAB

Τα OKLCH και OKLAB είναι καλύτερα για ομαλές κλίμακες και προβλέψιμες αλλαγές φωτεινότητας.

Κάνουν πιο εύκολη τη δουλειά με παλέτες όταν σε νοιάζουν ισορροπημένες διαβαθμίσεις και αξιόπιστη αντίθεση.

Έλεγχοι αντίθεσης και έξοδος Tailwind

Οι έλεγχοι αντίθεσης και το έτοιμο αποτέλεσμα για frameworks μετατρέπουν έναν μετατροπέα σε πρακτικό εργαλείο UI.

Μπορείς να πας πιο γρήγορα από ένα χρώμα εισόδου σε προσβάσιμες επιλογές κειμένου και tokens φιλικά προς Tailwind.

Συχνές ερωτήσεις

Απαντήσεις για τις υποστηριζόμενες μορφές χρωμάτων, πότε να χρησιμοποιείς αντιληπτικούς χώρους όπως OKLCH και πώς να ερμηνεύεις τις εξόδους αντίθεσης και Tailwind.

Άλλα εργαλεία

Δες κάθε ξεχωριστή σελίδα εργαλείου από το κέντρο της αρχικής σελίδας ή τον κεντραρισμένο επιλογέα της κεφαλίδας.

Εικόνες

Μετατροπέας WebP

Μετάτρεψε έως 10 εικόνες JPEG, PNG ή WebP σε WebP με presets ποιότητας και ZIP downloads.

Άνοιγμα Μετατροπέας WebP

Assets

Γεννήτρια Favicon / App Icon

Ανέβασε μία τετράγωνη αρχική εικόνα και δημιούργησε πακέτο favicon με app icons και starter web manifest.

Άνοιγμα Γεννήτρια Favicon

Μορφές δεδομένων

Μετατροπέας JSON / YAML / TOML

Έλεγξε, μορφοποίησε, κάνε minify και μετάτρεψε JSON, YAML και TOML με σαφείς προειδοποιήσεις συμβατότητας.

Άνοιγμα JSON / YAML / TOML

Μορφές δεδομένων

Έλεγχος CSV

Έλεγξε CSV αρχεία και επικολλημένες γραμμές με ανίχνευση delimiter, ελέγχους κεφαλίδας, λίστες ζητημάτων και αναλυμένες προεπισκοπήσεις.

Άνοιγμα Έλεγχος CSV

Κείμενο

Case / Slug / Escape

Μετάτρεψε κείμενο σε camelCase, snake_case, kebab-case, PascalCase, slugs και κοινές escaped μορφές.

Άνοιγμα Case / Slug / Escape

Κείμενο

Έλεγχος και προεπισκόπηση Markdown

Έλεγξε τη δομή Markdown, δες προεπισκόπηση της απόδοσης και εντόπισε κοινά ζητήματα σύνταξης πριν τη δημοσίευση.

Άνοιγμα Έλεγχος Markdown