Organische Border und Flächen mit CSS

 

Mit CSS lassen sich auch ganz einfach organisch wirkende Formen erzeugen. Genutzt wird für diese kleine Spielerei die CSS Property border-radius. In unserem Beispiel unten werden für die Ecken eines DIV-Containers unterschiedliche Radien definiert und das Resultat sieht wie folgt aus:

 

 

Der CSS-Code zu unserem Beispiel:

background: #f09;
background-image: linear-gradient(45deg, #3023AE 0%, #f09 100%);
border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
width:380px;
height: 340px;

 

 

Datenschutz Einstellungen
When you visit our website, it may store information through your browser from specific services, usually in form of cookies. Here you can change your privacy preferences. Please note that blocking some types of cookies may impact your experience on our website and the services we offer.