Comparison Slider

Create a before/after comparison slider. Use two overlapping panels representing a before and after state, with a vertical draggable divider in the middle. As the divider moves, it reveals more of one panel and less of the other. Add a small handle on the divider. Use CSS clip-path and JavaScript for drag handling. Use Tailwind CSS. The panels can be placeholder color blocks with labels.

创建一个前后对比滑块。使用两个重叠面板表示 before 和 after 状态，中间有一条垂直可拖拽分隔线。分隔线移动时，显示更多一个面板、更少另一个面板。在分隔线上添加小手柄。使用 CSS clip-path 和 JavaScript 处理拖拽。使用 Tailwind CSS。面板可用带标签的彩色占位块。