CSS widgets

En samling widgets jag kodat, främst i HTML & CSS, med inslag av viss JavaScript.

Exempel på min förmåga att designa kreativt, utveckla idéen och leverera den till en webbsida.

Klicka <här> för att testa fler JavaScript program!

Playful button

En härligt lekfull knapp med tillfredsställande animationer hover-effekter och klickeffekter.

Knappen är placerad i en stilren flexbox container som framhäver dess känsla.

Hovra &
klicka

Accordion Carousel

En stilfull karusell av bilder, där den klickade bilden expanderas och blir en länk till valfri sida.

En subtil och stilren animation cirkulerar kring det valda objektet.

Dynamic Prices block

Iframe till en grid-lösning av en prislista, anpassad för komplexa dynamiska priser.

Klicka här för att komma till GitHub sidan: Dynamic Price Block

Speciellt framtagen för JumpYard.

CSS Loading Spinner

En avancerad och häftig laddningsindikator skapad med ren CSS.

Perfekt för att förbättra användarupplevelsen under långsamma laddningstider.

3D Card Flip Gallery

Interaktiva 3D-kort som överlappas och staplas elegant.

Hovra över ett kort för att flytta det framåt och vända det - visar kompetenser på ett engagerande sätt.

💻

Frontend

Tryck/hovra för mer info

Frontend

HTML5, CSS3, JavaScript, Bootstrap, Responsive Design, Accessibility

🎨

Design

Tryck/hovra för mer info

Design

UI/UX Design, Figma, Adobe Photoshop, Brand Identity, Animation

⚙️

Backend

Tryck/hovra för mer info

Backend

Python, Node.js

Scroll snap swiper

En mobilvänlig swiper med scroll-snap funktionalitet.

Man kan byta ut nuvarande a länkar + bilder med precis vad du vill, Även fler div element kan läggas in.

Swipea och prova! (Endast mobil)

Swipe ->

Swiper för mobile

<-- -->

<- Swipe

Glassmorphism Card Stack

Moderna glassmorphism-kort med frostat glas-effekt och subtila skuggor.

En trendig designstil som skapar djup och elegans.

Premium Design

Glassmorphism är en modern designtrend som använder frostat glas-effekter för att skapa djup och elegans.

Tekniken kombinerar backdrop-filter, transparens och subtila skuggor.

Modern UI

Animated Nav links

En kreativ och interaktiv navigationsmeny som förbättrar användarupplevelsen.

Med stilrena animationer och tydliga visuella indikatorer som gör det inbjudande för användare att utforska webbplatsen.

Du klickade!

Välkommen till hemsidan. Kan du hitta fler hemliga achievements?

10 klick

Har du sett alla sidor nu?

25 klick

Bra jobbat! Du är en hängiven besökare.

50 klick

Wow! Du går all-in, va?

100 klick

Fantastiskt! Du är en riktig superanvändare.
Ledtråd: Hitta den gömda cirkeln!

500 klick

Otroligt! Du är en mästare på att utforska.
Ledtråd: Har jag fler github repositories?..

1000 klick

Det måste vara ett rekord!
Tips: Om du anställer mig får du en super-achievement!

Pratglad

Du navigerade till kontaktsidan för första gången. Välkommen att ta kontakt med mig!

Rekryteraren

Du kikade på mitt CV, tack för ditt intresse!

Utvecklaren

Du navigerade till min JavaScript sida.

Välkommen hem

Du hittade tillbaka till startsidan från en annan sida.

Tack för ditt meddelande!

Ditt meddelande är skickat. Jag hör av mig så snart jag kan.

Secret Finder

Du hittade den gömda cirkeln!
Njut av ljuv musik: Klicka här för att lyssna!

Ljuset tänds!

Du hittade hemsidans ljusa läge.

Den utvalda

Du vann spelet och bevisade dig värdig.

Widget lover

Du navigerade till min 'CSS widgets' sida.