Qwen3-VL-8B-Instruct

Houdini Gradient Border Button
A 0.86T 0.28
1<!DOCTYPE html>
2<html lang="en">
3<head>
4    <meta charset="UTF-8">
5    <meta name="viewport" content="width=device-width, initial-scale=1.0">
6    <title>Shiny Border</title>
7    <style>
8        body {
9            background-color: black;
10            display: flex;
11            justify-content: center;
12            align-items: center;
13            height: 100vh;
14            margin: 0;
15        }
16        .box {
17            width: 120px;
18            height: 40px;
19            background-color: #000;
20            color: white;
21            border: 2px solid #00f;
22            border-radius: 4px;
23            display: flex;
24            justify-content: center;
25            align-items: center;
26            font-family: Arial, sans-serif;
27            font-weight: bold;
28            position: relative;
29            overflow: hidden;
30        }
31        .box::before {
32            content: '';
33            position: absolute;
34            top: 0;
35            left: 0;
36            width: 100%;
37            height: 100%;
38            background: linear-gradient(90deg, rgba(0, 255, 255, 0.3), rgba(0, 255, 255, 0.1), rgba(0, 255, 255, 0.3));
39            border-radius: 4px;
40            animation: shine 2s ease-in-out infinite;
41        }
42        @keyframes shine {
43            0% {
44                transform: translateX(-100px);
45            }
46            50% {
47                transform: translateX(100px);
48            }
49            100% {
50                transform: translateX(-100px);
51            }
52        }
53    </style>
54</head>
55<body>
56    <div class="box">Shiny Border</div>
57</body>
58</html>