← Back to dashboard

striped wavy ribbon, green to blue

Model: medium_openai | Tier: medium | ID: d0db1434-dc5c-4a18-85b9-3fda552d6ced_b9a772a37fb21d56 | 33 elements

0.647
Editability
0.921
Coverage
0.703
Purity
0.180
Crosstalk
0.139
Compact
0.497
Locality
0.787
Contiguity
full
Showing: full SVG

Concept Groups

central blue stripe: 0 21 22 23 24 25 26 27
rightmost green stripe: 17 18 19 20 28 29 30
upper wavy dark arc: 1 32
lower wavy dark arc: 31
rightmost black circular end: 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

Elements — click to highlight

#TagConceptPurityContributions
0 rect central blue stripe
1.000
central blue
0.000
rightmost gr
0.000
upper wavy d
0.000
lower wavy d
0.000
rightmost bl
0.000
1 use upper wavy dark arc
0.503
central blue
0.003
rightmost gr
0.005
upper wavy d
0.609
lower wavy d
0.569
rightmost bl
0.024
2 rect rightmost black circ
0.994
central blue
0.000
rightmost gr
0.000
upper wavy d
0.000
lower wavy d
0.000
rightmost bl
0.034
3 rect rightmost black circ
0.811
central blue
0.000
rightmost gr
0.003
upper wavy d
0.001
lower wavy d
0.003
rightmost bl
0.028
4 rect rightmost black circ
0.806
central blue
0.000
rightmost gr
0.005
upper wavy d
0.001
lower wavy d
0.001
rightmost bl
0.030
5 rect rightmost black circ
0.820
central blue
0.002
rightmost gr
0.003
upper wavy d
0.001
lower wavy d
0.001
rightmost bl
0.034
6 rect rightmost black circ
0.785
central blue
0.003
rightmost gr
0.003
upper wavy d
0.001
lower wavy d
0.002
rightmost bl
0.033
7 rect rightmost black circ
0.948
central blue
0.000
rightmost gr
0.000
upper wavy d
0.001
lower wavy d
0.001
rightmost bl
0.028
8 rect rightmost black circ
0.859
central blue
0.002
rightmost gr
0.000
upper wavy d
0.001
lower wavy d
0.002
rightmost bl
0.028
9 rect rightmost black circ
0.915
central blue
0.000
rightmost gr
0.000
upper wavy d
0.001
lower wavy d
0.001
rightmost bl
0.030
10 rect rightmost black circ
0.872
central blue
0.003
rightmost gr
0.000
upper wavy d
0.001
lower wavy d
0.001
rightmost bl
0.029
11 rect rightmost black circ
0.874
central blue
0.003
rightmost gr
0.000
upper wavy d
0.001
lower wavy d
0.001
rightmost bl
0.030
12 rect rightmost black circ
0.864
central blue
0.000
rightmost gr
0.000
upper wavy d
0.001
lower wavy d
0.003
rightmost bl
0.028
13 rect rightmost black circ
0.682
central blue
0.002
rightmost gr
0.001
upper wavy d
0.002
lower wavy d
0.007
rightmost bl
0.026
14 rect rightmost black circ
0.670
central blue
0.004
rightmost gr
0.005
upper wavy d
0.002
lower wavy d
0.002
rightmost bl
0.025
15 rect rightmost black circ
0.839
central blue
0.000
rightmost gr
0.003
upper wavy d
0.001
lower wavy d
0.002
rightmost bl
0.028
16 rect rightmost black circ
0.697
central blue
0.000
rightmost gr
0.003
upper wavy d
0.001
lower wavy d
0.004
rightmost bl
0.018
17 rect rightmost green stri
0.768
central blue
0.000
rightmost gr
0.144
upper wavy d
0.000
lower wavy d
0.000
rightmost bl
0.043
18 rect rightmost green stri
0.655
central blue
0.000
rightmost gr
0.139
upper wavy d
0.018
lower wavy d
0.017
rightmost bl
0.039
19 rect rightmost green stri
0.668
central blue
0.000
rightmost gr
0.137
upper wavy d
0.015
lower wavy d
0.013
rightmost bl
0.041
20 rect rightmost green stri
0.441
central blue
0.102
rightmost gr
0.131
upper wavy d
0.013
lower wavy d
0.011
rightmost bl
0.040
21 rect central blue stripe
0.632
central blue
0.105
rightmost gr
0.000
upper wavy d
0.011
lower wavy d
0.011
rightmost bl
0.039
22 rect central blue stripe
0.606
central blue
0.107
rightmost gr
0.000
upper wavy d
0.016
lower wavy d
0.016
rightmost bl
0.038
23 rect central blue stripe
0.560
central blue
0.111
rightmost gr
0.000
upper wavy d
0.024
lower wavy d
0.022
rightmost bl
0.041
24 rect central blue stripe
0.592
central blue
0.118
rightmost gr
0.000
upper wavy d
0.020
lower wavy d
0.020
rightmost bl
0.041
25 rect central blue stripe
0.602
central blue
0.111
rightmost gr
0.000
upper wavy d
0.018
lower wavy d
0.018
rightmost bl
0.037
26 rect central blue stripe
0.632
central blue
0.111
rightmost gr
0.000
upper wavy d
0.013
lower wavy d
0.015
rightmost bl
0.036
27 rect central blue stripe
0.603
central blue
0.104
rightmost gr
0.000
upper wavy d
0.017
lower wavy d
0.018
rightmost bl
0.033
28 rect rightmost green stri
0.427
central blue
0.100
rightmost gr
0.130
upper wavy d
0.019
lower wavy d
0.022
rightmost bl
0.032
29 rect rightmost green stri
0.668
central blue
0.000
rightmost gr
0.137
upper wavy d
0.015
lower wavy d
0.018
rightmost bl
0.035
30 rect rightmost green stri
0.695
central blue
0.000
rightmost gr
0.137
upper wavy d
0.012
lower wavy d
0.014
rightmost bl
0.034
31 use lower wavy dark arc
0.487
central blue
0.008
rightmost gr
0.011
upper wavy d
0.055
lower wavy d
0.086
rightmost bl
0.016
32 use upper wavy dark arc
0.504
central blue
0.002
rightmost gr
0.002
upper wavy d
0.108
lower wavy d
0.099
rightmost bl
0.003

SVG Code

<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="500" viewBox="0 0 1200 500"> <!-- Step-by-step analysis (from the description): 1) White background with a single central subject: a ribbon-like, wavy band. 2) The ribbon is composed of alternating stripes (black + colored). 3) The colored stripes transition along the ribbon length: green (left) -> blue (center dip) -> green (right). 4) The ribbon has a smooth sinusoidal path and a subtle 3D feel via gentle shading/highlight. 5) Clean vector style: crisp edges, no noise/texture. --> <!-- Background --> <rect x="0" y="0" width="1200" height="500" fill="#ffffff"/> <defs> <!-- A smooth wavy centerline for the ribbon --> <path id="ribbonPath" d="M 80 240 C 220 120, 380 120, 520 240 C 660 380, 820 380, 960 240 C 1060 140, 1120 160, 1160 220" /> <!-- Color gradient that runs along the ribbon length: green -> blue -> green --> <linearGradient id="ribbonColor" x1="80" y1="0" x2="1160" y2="0" gradientUnits="userSpaceOnUse"> <stop offset="0%" stop-color="#23d84a"/> <stop offset="50%" stop-color="#1f6dff"/> <stop offset="100%" stop-color="#23d84a"/> </linearGradient> <!-- Subtle highlight gradient for a slight 3D feel --> <linearGradient id="highlight" x1="0" y1="0" x2="0" y2="1"> <stop offset="0%" stop-color="#ffffff" stop-opacity="0.35"/> <stop offset="55%" stop-color="#ffffff" stop-opacity="0.00"/> <stop offset="100%" stop-color="#000000" stop-opacity="0.10"/> </linearGradient> <!-- Clip path to keep stripes constrained to the ribbon silhouette --> <clipPath id="ribbonClip" clipPathUnits="userSpaceOnUse"> <!-- Thick stroke expanded into a filled shape via stroke + clip on group content --> <use href="#ribbonPath" fill="none" stroke="#000" stroke-width="140" stroke-linecap="round" stroke-linejoin="round"/> </clipPath> <!-- A slightly thinner inner clip to create a clean edge margin --> <clipPath id="ribbonInnerClip" clipPathUnits="userSpaceOnUse"> <use href="#ribbonPath" fill="none" stroke="#000" stroke-width="128" stroke-linecap="round" stroke-linejoin="round"/> </clipPath> <!-- Soft shadow for depth --> <filter id="softShadow" x="-20%" y="-20%" width="140%" height="140%"> <feGaussianBlur in="SourceAlpha" stdDeviation="3" result="blur"/> <feOffset dx="0" dy="3" result="off"/> <feColorMatrix in="off" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0" result="shadow"/> <feMerge> <feMergeNode in="shadow"/> <feMergeNode in="SourceGraphic"/> </feMerge> </filter> </defs> <!-- Ribbon base silhouette (for crisp outer edge) --> <use href="#ribbonPath" fill="none" stroke="#0b0b0b" stroke-width="146" stroke-linecap="round" stroke-linejoin="round" opacity="0.95" filter="url(#softShadow)"/> <!-- Stripes clipped to ribbon shape --> <g clip-path="url(#ribbonClip)"> <!-- Black stripes (alternating) --> <g clip-path="url(#ribbonInnerClip)" opacity="0.95"> <!-- Create vertical stripes across the whole canvas; clipping makes them ribbon-only --> <!-- Stripe width and spacing tuned to look like ribbon banding --> <g> <!-- black stripes --> <rect x="0" y="0" width="40" height="500" fill="#0a0a0a"/> <rect x="80" y="0" width="40" height="500" fill="#0a0a0a"/> <rect x="160" y="0" width="40" height="500" fill="#0a0a0a"/> <rect x="240" y="0" width="40" height="500" fill="#0a0a0a"/> <rect x="320" y="0" width="40" height="500" fill="#0a0a0a"/> <rect x="400" y="0" width="40" height="500" fill="#0a0a0a"/> <rect x="480" y="0" width="40" height="500" fill="#0a0a0a"/> <rect x="560" y="0" width="40" height="500" fill="#0a0a0a"/> <rect x="640" y="0" width="40" height="500" fill="#0a0a0a"/> <rect x="720" y="0" width="40" height="500" fill="#0a0a0a"/> <rect x="800" y="0" width="40" height="500" fill="#0a0a0a"/> <rect x="880" y="0" width="40" height="500" fill="#0a0a0a"/> <rect x="960" y="0" width="40" height="500" fill="#0a0a0a"/> <rect x="1040" y="0" width="40" height="500" fill="#0a0a0a"/> <rect x="1120" y="0" width="40" height="500" fill="#0a0a0a"/> </g> <!-- colored stripes laid over the gaps using a gradient fill --> <g fill="url(#ribbonColor)"> <rect x="40" y="0" width="40" height="500"/> <rect x="120" y="0" width="40" height="500"/> <rect x="200" y="0" width="40" height="500"/> <rect x="280" y="0" width="40" height="500"/> <rect x="360" y="0" width="40" height="500"/> <rect x="440" y="0" width="40" height="500"/> <rect x="520" y="0" width="40" height="500"/> <rect x="600" y="0" width="40" height="500"/> <rect x="680" y="0" width="40" height="500"/> <rect x="760" y="0" width="40" height="500"/> <rect x="840" y="0" width="40" height="500"/> <rect x="920" y="0" width="40" height="500"/> <rect x="1000" y="0" width="40" height="500"/> <rect x="1080" y="0" width="40" height="500"/> </g> <!-- Subtle highlight/shading overlay to suggest curvature --> <use href="#ribbonPath" fill="none" stroke="url(#highlight)" stroke-width="128" stroke-linecap="round" stroke-linejoin="round" opacity="0.85"/> </g> </g> <!-- Clean inner edge line to sharpen the silhouette slightly --> <use href="#ribbonPath" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" opacity="0.25"/> </svg>