Ontwerp en CSS

Creëer kleuren, responsieve afmetingen en productieklare CSS.

Kleur & Toegankelijkheid

KleurconverterConverteer kleuren tussen HEX, RGB, HSL, HSV, CMYK en LAB — bewerk een veld en de rest verandert direct mee.Gespecialiseerde pagina's (8)
ContrastcontroleVoer een tekst- en achtergrondkleur in om de WCAG-contrastverhouding te zien en te controleren welke AA- en AAA-niveaus worden behaald.

CSS Layout & Effecten

Box Shadow GeneratorSleep schuifregelaars om een box-shadow te maken, stapel lagen voor extra diepte en kopieer direct de voltooide CSS.
Gradient GeneratorOntwerp een lineair, radiaal of conisch verloop, voeg kleurstops toe, bepaal de richting en kopieer direct de CSS.
Border Radius GeneratorRond elke hoek af met schuifregelaars, maak organische blobs met de elliptische modus en kopieer direct de CSS.
Flexbox GeneratorStel een flex-container en de bijbehorende items in met visuele knoppen, zie de lay-out direct reageren en kopieer de CSS met één klik.
CSS Grid GeneratorStel je kolommen en rijen in, sleep over de cellen om items te plaatsen en kopieer met één klik de grid-CSS met bijbehorende HTML.
CSS Cubic Bezier GeneratorSleep de twee hendels om een easingcurve te ontwerpen, zie hoe een stip de curve volgt ten opzichte van een constante snelheid en kopieer de cubic-bezier()-waarde.
CSS clamp() CalculatorVoer een grootte in voor kleine en grote schermen en krijg een vloeiende clamp()-waarde die er prachtig tussenin schaalt — voor lettergroottes, padding, marges of gaps.

Font-inspectie & Licenties

Lettertypelicentie- & info-checkerOpen een lokaal lettertype om de ingebedde namen, licentietekst en document-inbeddingsvlaggen te lezen — als bewijsmateriaal uit het bestand, niet als bewijs dat u een licentie bezit.

Scherm, Print & Verhoudingen