Hamburger-Menus gehören heute ja nicht mehr nur zu der mobilen Version einer Webseite, sondern sind immer öfter auch Teil eines Mega Menus. Mit einem Klick auf so ein Menu öffnet sich irgendwo ein verstecktes Menu. Der Vorteil dieser Art ist, man kann das Menu mehr...
HTML
Neuer Button Design mit Lichtblitz Effekt
Ich sage immer, dass Buttons das wohl wichtigste Element einer Webseite sind, denn ein schlechter Button wird übersehen und ein guter Button treibt den CTA in die Höhe. Leider machen viele Webdesigner ihre Buttons meistens sehr langweilig oder sie verstecken sie ganz...
Cooler Card Hover Effekt mit HTML und CSS erstellen
Wenn man eine neue Webseite designt ist man immer auf der Suche nach coolen Ideen und heute möchte ich euch eine zeigen. Ich habe hier nämlich eine Idee wie ihr Cards designen und positionieren und animieren könnt. Ich habe das schon mehrmals auf Webseite gesehen wo...
Wie erstelle ich eine Hintergrund Blob Animation mit HTML und CSS
Diese sogenannten Blobs, man könnte es auf Deutsch als Tropfen übersetzen, sieht man zur Zeit immer öfters im Webdesign. Ja es ist fast ein Trend. Diese Elemente werden als normale Formen in Webseiten eingesetzt oder sogar als ganz wilde Animationen. Heute zeige ich...
Wir programmieren ein Game – Kill die Ratte mit HTML, CSS und Javascript
Laut Statistik sind ja unter meinen Lesern / Zuschauer ganz junge wie auch ganz alte Säcke (so wie ich einer bin) und darum erinnern sich nur ein Teil an ein legendäres Game aus den Nuller Jahren und zwar hiess es Moorhuhnjagd. Heute werden wir was ganz ähnliches...
Wie erstelle ich einen springenden Ball mit CSS und HTML?
Heute zeige ich euch wie man so einen springenden Ball zeichnen und animieren kann. Video HTML <div class="ball"></div> CSS :root { --bg: #b4838d; --ball: #f36725; --rand: #000; } * { margin: 0; padding: 0; box-sizing: border-box; } body {...
Eine Clip Path Animation erstellen
Mit Clip Path kann man nicht nur Bilder verrückte Formen geben, sondern sie auch als Teil einer Animation für Texte und andere Elemente verwenden. Clippy habe ich euch ja schon öfters gezeigt, denn dieses Tool ist sehr praktisch wenn man Bilder oder wie wir heute...
Wie kann ich einen eigenen Mauszeiger erstellen? (HTML, CSS & Javascript)
Man sieht es bei Webseiten immer wieder – anstatt dass es der normale Mauszeiger ist, hat die Webseite eine eigene Version erstellt. Ich rede hier jetzt nicht davon, einfach ein SVG einzubinden – das könnte man auch machen. Nein, ich rede von einem mit CSS designten...
Wie kann ich ein Split Screen Effekt für Texte erstellen? (HTML & CSS Anleitung)
Wolltet ihr schon mal eine Art Zeitungsdesign in eure Webseite einbauen? Dieses Block Design kann man mit CSS bekommen. Heute zeige ich euch wie ihr so ein Split Screen erstellen könnt. Damit bleiben die Inhalt eurer Seite immer bei 50% / 50%. Video HTML <div...
Wie programmiere ich Tab mit HTML und CSS?
Die sogenannten Tabs sind Elemete in einer Webseite wo man verschiedene Inhalte mehrmals am gleichen Ort positionieren kann und der Wechsel macht man über einen einfachen Button. Tabs gehören heute zur Grundausstattung einer Webseite. Ich persönlich mag sie nur...








