Signaturgenerator

1. Innledning

Signaturgenerator er et nettleserbasert verktøy som lar deg opprette en håndskrevet digital signatur ved hjelp av mus, styreflate eller berøringsskjerm. Du kan tegne signaturen direkte på et lerret, tilpasse farge og tykkelse, justere bakgrunnen (inkludert gjennomsiktighet) og eksportere den i flere bildeformater som SVG, PNG, JPG og WEBP.

Dette verktøyet er ideelt for å signere digitale dokumenter, legge til signaturer i PDF-filer, bygge inn en signatur i e-postsignaturer eller forberede gjennomsiktige signaturbilder til designprosjekter. Siden alt kjører i nettleseren din, kreves det ingen opplasting eller behandling på serversiden. Signaturen genereres umiddelbart og kan lastes ned med en gang i formatet du trenger.

Enten du trenger en ren, gjennomsiktig PNG for kontrakter, en skalerbar SVG for utskrift eller en JPG for rask deling, gir denne signaturgeneratoren en rask og fleksibel løsning for både personlig og profesjonell bruk.

2. Slik fungerer det

Verktøyet bruker et interaktivt HTML5-lerret der brukere kan tegne frihåndsstreker. Hver strek registreres som en sekvens av punkter, inkludert posisjon, tid og trykkdata (når tilgjengelig). Disse punktene behandles til jevne kurver, noe som gir en naturlig håndskrift i stedet for grove eller hakkete linjer.

Inndataparametere

• Lerretsområde: Tegneflaten der du oppretter signaturen din.
• Pennefarge: Velg en egendefinert skrivefarge i heksadesimalt format (konverteres internt til RGB).
• Bakgrunnsfarge: Velg en heldekkende farge eller en gjennomsiktig bakgrunn ved hjelp av RGBA-verdier.
• Pennetykkelse: Tre valgbare tykkelsesnivåer som justerer minimums- og maksimumsbredden på streken.
• Sideforhold: Velg mellom 16:9, 4:3, 3:4 eller 1:1 for å kontrollere lerretets dimensjoner.

Logikk for gjengivelse av streker

Mens du tegner, registrerer systemet peker- eller berøringshendelser og konverterer dem til kurvesegmenter. Det beregner strekhastigheten for dynamisk å justere linjetykkelsen og skape en naturlig penneeffekt. Hver strek lagres som strukturerte data, noe som muliggjør funksjoner som Angre og nytegning av bakgrunnen uten å miste signaturen.

Valideringsregler

• Verdier for pennetykkelse under 1 settes automatisk til minste støttede tykkelse.
• Fargeinndata må følge et gyldig heksadesimalt format.
• Endring av lerretsstørrelse er begrenset etter at tegningen har startet for å forhindre forvrengning.
• Angre fjerner bare den siste streken dersom strekdata finnes.

Utdataformater

Du kan eksportere signaturen din i:

• SVG – Skalerbart vektorformat, ideelt for utskrift i høy oppløsning.
• PNG – Støtter gjennomsiktighet.
• JPG – Komprimert format for generell bruk.
• WEBP – Moderne optimalisert bildeformat.

Begrensninger

• Verktøyet verifiserer ikke identitet eller tilbyr juridisk bindende autentisering.
• Signaturer tegnes manuelt og genereres ikke automatisk fra tekst.
• Endring av størrelse etter tegning kan kreve at lerretet tømmes.

3. Slik bruker du dette verktøyet

1. Velg ønsket sideforhold for lerretet.
2. Velg et nivå for pennetykkelse.
3. Angi ønsket signaturfarge.
4. Velg eventuelt en bakgrunnsfarge (eller behold den gjennomsiktig).
5. Tegn signaturen din med mus eller berøringsskjerm.
6. Bruk Angre for å fjerne den siste streken ved behov.
7. Klikk på Tøm for å tilbakestille lerretet fullstendig.
8. Last ned signaturen din i SVG-, PNG-, JPG- eller WEBP-format.

4. Praktiske eksempler

Eksempel 1: Gjennomsiktig PNG for PDF-kontrakter

Inndata:

• Sideforhold: 4:3
• Pennefarge: Svart (#000000)
• Bakgrunn: Gjennomsiktig
• Pennetykkelse: Middels

Utdata: download.png (gjennomsiktig bakgrunn)

Bruk denne filen til å sette inn signaturen din i en PDF-kontrakt uten en hvit boks bak den.

Eksempel 2: SVG i høy oppløsning for utskrift

Inndata:

• Sideforhold: 16:9
• Pennefarge: Blå (#1a73e8)
• Bakgrunn: Hvit
• Pennetykkelse: Tykk

Utdata: download.svg

Siden SVG er et vektorbasert format, forblir signaturen skarp når den skaleres for brevhoder eller trykksaker.

5. Bruksområder for utviklere

- Systemer for dokumentautomatisering

Integrer nedlastede signaturbilder i automatiserte arbeidsflyter for dokumentgenerering (f.eks. kontrakter, fakturaer og avtaler).

- Signaturinnhenting på klientsiden

Bruk de eksporterte Base64-bildedataene til AJAX-opplastinger:

const dataUrl = signaturePad.toDataURL('image/png');
// Send dataUrl til backend-API for lagring

- Innebygging av SVG i webapplikasjoner

Siden SVG-utdata er vektorbaserte, kan de bygges direkte inn i HTML:

<img src="signature.svg" alt="Digital signatur">

- Sikker datahåndtering

Siden signaturgenereringen skjer helt i nettleseren, er behandling på serversiden ikke nødvendig med mindre det er eksplisitt implementert. Dette reduserer risikoen for dataeksponering. Utviklere kan validere Base64-strenger på serversiden før lagring for å forhindre ugyldige inndata.

- Bakgrunnsbehandling i PHP

$base64 = $_POST['signature'];
$image = str_replace('data:image/png;base64,', '', $base64);
$image = base64_decode($image);
file_put_contents('signature.png', $image);

6. Vanlige spørsmål

Er denne signaturen juridisk bindende?

Nei. Dette verktøyet oppretter et digitalt bilde av din håndskrevne signatur. Juridisk gyldighet avhenger av jurisdiksjonen og hvordan signaturen brukes.

Kan jeg lage en gjennomsiktig signatur?

Ja. Velg en gjennomsiktig bakgrunn og last ned som PNG eller SVG.

Hvilket format er best for utskrift?

SVG anbefales for utskrift i høy oppløsning fordi det kan skaleres uten tap av kvalitet.

Kan jeg endre pennetykkelsen?

Ja. Du kan velge mellom tre forhåndsdefinerte tykkelsesnivåer for streker.

Lagrer verktøyet signaturen min?

Nei. Signaturen genereres lokalt i nettleseren din med mindre du laster den opp manuelt et annet sted.

Kan jeg angre en del av signaturen min?

Ja. Angre-knappen fjerner den siste streken.