Beskær billede rundt online gratis — Lav rundt profilbillede

Cirkel eller afrundet kvadrat: hvilken form skal du bruge

Formen er egentlig ikke dit valg — platformen lægger sin egen maske over, når den viser din avatar, og den kan du ikke tilsidesætte. Hvad du rent faktisk vælger, er, om din fil passer til den maske.

Det betyder noget, fordi en cirkel skærer omkring 21% af et kvadrat væk, og det hele sker i hjørnerne. Beskærer du selv til en cirkel, kan du se præcis, hvad der overlever. Uploader du et helt kvadrat og håber det bedste, klipper platformens cirkel i det, der tilfældigvis lå i de hjørner: toppen af en hat, en skulder, et halvt logo.

Tommelfingerreglen: ansigter tåler en cirkel, ordmærker tåler et afrundet kvadrat. Et ansigt er allerede nogenlunde rundt, så hjørnerne indeholdt aldrig information. Et logo med tekst i er som regel bredere end det er højt, og en cirkel amputerer enderne af ordet. Derfor bruger Slack, iOS og Play Store alle afrundede kvadrater til ikoner, mens ethvert socialt netværk bruger cirkler til mennesker.

Hvorfor en transparent PNG er de ekstra bytes værd

En cirkel beskåret i en JPG er ikke rigtig en cirkel. JPG har ingen alfakanal, så de fire hjørner skal indeholde noget — normalt hvidt. På en hvid side lægger ingen mærke til det. Sæt den avatar på et mørkt tema, et farvet kort, et slideshow eller et videooverlejr, og der dukker fire hvide trekanter op om hovedet.

PNG og WebP har begge en alfakanal, så hjørnerne gemmer "ingenting", og cirklen lægges pænt oven på enhver baggrund. Derfor er PNG standarden her. WebP klarer samme opgave med omkring en tredjedel af bytene, og enhver nutidig browser kan læse det — men nogle uploadformularer og ældre desktopprogrammer afviser stadig filendelsen, så PNG er det sikre valg, når du sender filen til andres system.

Det ene tilfælde, hvor JPG giver mening, er en størrelsesgrænse. Hvis en formular insisterer på JPG eller begrænser dig til nogle få snese kilobyte, så vælg JPG her og sæt baggrundsfarven til den, som destinationssiden rent faktisk bruger, så hjørnerne forsvinder ind i den.

Sådan beskærer du et ansigt, der stadig kan aflæses ved 32 pixel

Din avatar bliver næsten aldrig set i den størrelse, du eksporterede den i. I en kommentartråd er den 32 til 40 pixel bred. Ved den størrelse er det kun konturen af hovedet, kontrasten mellem ansigt og baggrund og cirka øjnenes placering, der overlever. Alt andet bliver til grød.

Beskær derfor tættere, end det føles naturligt. Fyld omkring 60–70% af cirklens højde med hovedet, sæt øjnene lidt over midterlinjen, og lad der være en smule luft over håret, så beskæringen ikke ser tilfældig ud. En rodet baggrund er den absolut mest almindelige fejl: den konkurrerer om de få tilgængelige pixels og gør hele miniaturebilledet til støj. Er din baggrund rodet, aflæses en ensfarvet eller udflydende baggrund bag en rund beskæring bedre i alle størrelser.

En praktisk test: Eksportér avataren, og se den derefter i din filhåndtering ved den mindste miniaturevisning. Kan du ikke se, at det er dig, kan ingen andre heller.

iOS-squirclen forklaret

Apples appikoner er ikke afrundede rektangler. Et afrundet rektangel forbinder sine lige kanter med et kvartcirkel-hjørne, og krumningen springer brat ved den samling — dit øje opfatter det som et lille knæk. Apple bruger i stedet en superellipse , hvor krumningen øges gradvist fra kanten, så konturen slet ikke har nogen synlig overgang. Designere kalder resultatet en squircle.

Canvas kan kun tegne hjørner som cirkelbuer, så tilstanden for afrundet kvadrat her er tilnærmelsen med et afrundet rektangel, ikke en ægte superellipse. Ved avatar-størrelser er forskellen én til to pixel ved hvert hjørne, og ingen vil bemærke det. Sæt hjørneradius til omkring 22% af siden, og du lander på samme forhold, som Apple bruger til appikoner; værktøjet bruger som standard 24%, hvilket svarer til, hvordan Slack og de fleste chatapps maskerer deres avatarer.

Skyderen går op til 50%, hvilket er en cirkel — et afrundet kvadrat, hvor hjørneradius når halvdelen af siden, har ingen lige kant tilbage. Denne sammenhæng er grunden til, at begge former deler én kodesti her i stedet for at være to separate værktøjer.

Kanter, og hvorfor de bliver klippet

En ring om en avatar er en god måde at holde den adskilt fra en rodet baggrund, og det er det ene stykke styling, der overlever platformens egen maske — så længe ringen er inden i dit billede og ikke uden om det.

Det er værd at være præcis om. Hvis et værktøj tilføjer en 6 px kant uden om en 320 px cirkel, bliver filen 332 px, og platformen skalerer den derefter om og lægger sin egen runde maske over igen — som skærer midt igennem din ring og gør den ujævn. Dette værktøj tegner kanten inden i i den størrelse, du har angivet, så 320 px forbliver 320 px, og ringen sidder præcis på den kant, masken forventer. Kant-skyderen er af samme grund begrænset til 12% af siden: derover holder den op med at være en ring og bliver til en ramme.

Hvorfor beskæring i browseren er mere privat

De fleste "rund beskæring online"-sider uploader dit foto, beskærer det på en server og sender det tilbage. For et billede af dit eget ansigt er det en reel forskel: der findes en kopi på en andens disk, dækket af hvad end deres opbevaringspolitik siger den måned, og ofte af en vilkårsklausul, der giver dem en licens til den.

Resizo har ingen backend, der modtager billeder. Beskæringen kører i din fane via browserens egen canvas-API. To måder at tjekke det på: åbn browserens netværkspanel og se, at der ikke sendes noget, mens du beskærer, eller afbryd internetforbindelsen, efter siden er indlæst, og beskær alligevel — det virker stadig.

En nyttig sidegevinst: genkodning fjerner EXIF-metadata, så de GPS-koordinater og det tidsstempel, din telefon skrev ind i originalen, ikke følger med den avatar, du poster offentligt. Har du brug for de metadata, skal du gemme originalfilen.