diff --git a/ismism.ts/ui/index.html b/ismism.ts/ui/index.html
index 2d9b9a6..228bd5d 100644
--- a/ismism.ts/ui/index.html
+++ b/ismism.ts/ui/index.html
@@ -333,6 +333,41 @@
 		background: none;
 	}
 
+	.circle {
+		display: flex;
+		flex-flow: row wrap;
+		justify-content: center;
+		text-align: center;
+	}
+
+	.circle>div {
+		flex-basis: 1px;
+		flex-grow: 1;
+		display: flex;
+		flex-flow: column nowrap;
+		align-items: center;
+		margin: 10px;
+		font-size: var(--large);
+	}
+
+	.circle>div>.progress {
+		--size: 4em;
+		width: var(--size);
+		height: var(--size);
+		margin-bottom: 10px;
+		border-radius: 50%;
+		display: grid;
+		place-items: center;
+		background:
+			radial-gradient(closest-side, var(--cl-white) 66%, transparent 0 100%),
+			conic-gradient(var(--cl-gray) calc(var(--value) * 1%), var(--cl-light-gray) 0);
+		font-family: monospace;
+		font-size: calc(var(--size) / 2);
+		box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
+		color: var(--cl-amber);
+		text-shadow: 0 2px 2px var(--cl-light-gray);
+	}
+
 	.animate-left {
 		position: relative;
 		animation: animateleft 0.4s
@@ -437,6 +472,27 @@
 							<a href="pan.baidu.com">查看明细</a>
 						</div>
 					</div>
+					<br>活动目标：
+					<div class="circle">
+						<div>
+							<div class="progress" style="--value: 65">65%</div>
+							<span>雨棚扩建雨棚扩建雨棚扩建雨棚扩建雨棚扩建雨棚扩建雨棚扩建雨棚扩建雨棚扩建</span>
+						</div>
+						<div>
+							<div class="progress" style="--value: 65">65%</div>
+							<span>雨棚扩建雨棚扩建</span>
+
+						</div>
+						<div>
+							<div class="progress" style="--value: 100; color: var(--cl-gray)">完成</div>
+							<span>雨棚扩建雨棚扩建</span>
+
+						</div>
+						<div>
+							<div class="progress" style="--value: 0; color: var(--cl-gray)">0%</div>
+							<span>雨棚扩建</span>
+						</div>
+					</div>
 				</section>
 
 				<div class="w3-container">