在CSS中畫不規則圖形有許多方法，以下介紹其中三種方法。

方法一：使用多個div拼接成不規則圖形。

.container {
position: relative;
}
.shape1, .shape2, .shape3 {
position: absolute;
background-color: #f1c40f;
}
.shape1 {
width: 100px;
height: 100px;
left: 0;
top: 0;
clip-path: polygon(0 0, 60% 0, 50% 50%, 0 60%);
}
.shape2 {
width: 100px;
height: 100px;
right: 0;
top: 0;
clip-path: polygon(100% 0, 40% 0, 50% 50%, 100% 60%);
}
.shape3 {
width: 100px;
height: 100px;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
clip-path: polygon(0 50%, 50% 100%, 100% 50%, 50% 0);
}

在以上代碼中，我們定義了三個div元素，使用clip-path屬性使得div元素成為不規則圖形，在父容器中定位，最后拼接成完整的不規則圖形。

方法二：使用Svg路徑繪制不規則圖形。

.shape {
fill: #34495e;
stroke: #2c3e50;
stroke-width: 2px;
}

<svg viewBox="0 0 100 100">
<path class="shape" d="M0 0 L60 0 L50 50 L0 60 Z"></path>
<path class="shape" d="M100 0 L40 0 L50 50 L100 60 Z"></path>
<path class="shape" d="M50 50 L0 50 L50 100 L100 50 Z"></path>
</svg>

使用Svg語言定義路徑繪制不規則圖形，包括填充顏色、描邊顏色和描邊寬度等。

方法三：使用CSS偽元素繪制不規則圖形。

.shape {
position: relative;
}
.shape::before, .shape::after {
content: "";
position: absolute;
background-color: #e74c3c;
}
.shape::before {
top: 0;
left: 0;
width: 70%;
height: 100%;
transform: skew(-20deg);
}
.shape::after {
top: 0;
right: 0;
width: 30%;
height: 100%;
transform: skew(-20deg);
}

通過定義偽元素的屬性和位置，實現不規則圖形的繪制，其中transform屬性的skew方法實現傾斜。