Wall Color Sim

Legger en gjennomskinnelig farge over et opplastet romfoto så du kan forhåndsvise hvordan en malingfarge kan se ut på veggene. Du velger et bilde fra enheten, velger en farge med systemets fargevelger og justerer opasiteten til overlegget fra 0 til 1 i trinn på 0,1. Overlegget gjengis som et absolutt posisjonert lag som dekker hele bildet, med pointer-events deaktivert.

1. Klikk på filinndataen øverst og velg en bildefil (en hvilken som helst image/*-type) fra enheten – bildet lastes inn via en lokal Object URL, så ingen opplasting skjer. 2. Bruk fargeinndataen til å velge en malingsfarge; standarden er #E8E8E8. 3. Dra Opacity-glidebryteren mellom 0 og 1 (trinn 0,1) for å styre hvor sterkt fargetonen vises over bildet. 4. Forhåndsvisningen med overlegg oppdateres umiddelbart når du endrer farge eller opasitet.

Bildet gjengis inne i en relativt posisjonert beholder, og fargetonen er et enkelt absolutt posisjonert div-element med inset-0 som ligger over hele bildet. background-color er den valgte hex-fargen og opasiteten er glidebryterverdien, så effekten er et flatt rektangel som dekker hele rammen – det oppdager ikke vegger, maskerer ikke bare veggflater og bruker ikke perspektiv. Lav opasitet (rundt 0,2–0,4) pleier å se mer realistisk ut for malingsforhåndsvisninger; full opasitet fyller ganske enkelt bildet med den valgte fargen.