Farger og design

Velg, konverter og kombiner farger, og generer CSS til designene dine.

• Clip-path-generator (CSS-former) Tegn CSS clip-path-former med draghåndtak. Rediger polygoner, sirkler, ellipser og innrykk, start med stjerner og piler, og kopier koden.
• CSS-gradientgenerator Lag lineære, radiale og koniske CSS-gradienter med direkte forhåndsvisning. Legg til og dra fargestopp, sett vinkelen og kopier ren CSS-kode med ett klikk.
• Cubic-bezier-editor (CSS-easing) Lag CSS-easingkurver med en cubic-bezier-editor med draghåndtak, sammenlign dem med linear i en direkte animasjon og kopier cubic-bezier() eller linear().
• Fargeblindhet-simulator Gratis simulator for fargeblindhet. Se bilder med protanopi, deuteranopi, tritanopi, de mildere formene eller akromatopsi, side ved side eller med glidebryter.
• Fargekonverter Konverter farger mellom HEX, RGB, HSL, HSV, HWB, CMYK, LAB, LCH og OKLCH. Lim inn en kode, se fargen og kopier alle formatene med ett klikk.
• Fargepalettegenerator Lag fargepaletter fra én grunnfarge med fargeharmonier: komplementær, analog, triadisk, tetradisk, kvadrat og monokromatisk. Eksporter som CSS, SCSS og JSON.
• Fargevelger Gratis fargevelger på nett. Velg en farge og kopier HEX-, RGB-, HSL-, HSV- og CMYK-kodene med én gang, med kontrastforhold mot hvitt og svart.
• Fargevelger fra bilde Last inn et bilde og klikk på en piksel for å få fargen som HEX, RGB, HSL, HSV og CMYK. Forstørrelsesglass, gjennomsnitt og liste over valgte farger.
• Finn fargenavn Finn navnet på en farge. Skriv inn en HEX- eller RGB-kode og få de 5 nærmeste navnene fra over 30 000 navngitte farger, pluss nærmeste CSS-fargenavn.
• Flexbox- og Grid-generator Bygg flexbox- og CSS Grid-layouter visuelt. Sett egenskaper for beholder og elementer, navngi grid-områder, se resultatet direkte og kopier ren CSS og HTML.
• Font-subsetter – lag mindre webfonter Lag et delsett av en font med bare tegnene du trenger, med HarfBuzz i nettleseren din. Få mindre TTF/OTF og WOFF, en forhåndsvisning og en @font-face-regel.
• Fontkombinasjoner – forhåndsvis overskrift og brødtekst Forhåndsvis fontkombinasjoner for overskrifter og brødtekst med 20 fonter med åpen lisens, juster størrelse og linjehøyde, og kopier CSS-font-family.
• Generator for avrundede hjørner (border-radius) Form CSS border-radius visuelt med draghåndtak. Sett hvert hjørne i px eller %, bruk den elliptiske syntaksen med 8 verdier, lag blobber og kopier koden.
• Generator for lysere og mørkere farger Lag lysere og mørkere nyanser av en farge i trinn på 5, 10, 20 eller 25 %, blandet i OKLCH eller sRGB, og eksporter som CSS-variabler eller Tailwind-konfig.
• Kontrastsjekker (WCAG) Gratis WCAG-kontrastsjekker. Skriv inn en tekst- og bakgrunnsfarge og få kontrastforholdet, AA/AAA-resultater og nærmeste farge som består.
• Palett fra bilde Hent ut en fargepalett fra et bilde. Last inn et foto og få de dominerende fargene som HEX-koder med andel av bildet, klare til å kopiere eller eksportere.
• PX til REM-konverter Regn om px til rem og em med valgfri rotskriftstørrelse, lag en konverteringstabell og gjør alle px-verdier i en CSS-snutt om til rem med ett klikk.
• Sideforholdskalkulator Sideforholdskalkulator som forkorter bredde og høyde, endrer størrelse med samme proporsjoner, sammenligner 16:9, 4:3 og 21:9 og gir deg CSS-koden aspect-ratio.
• Skyggegenerator (CSS box-shadow) Lag CSS-skygger med flere lag og direkte forhåndsvisning. Sett forskyvning, uskarphet, utvidelse, farge og dekkevne, prøv neumorphism og kopier koden.