Showing: full SVG
Concept Groups
third pill in stack with rounded ends and gradient fill: 4 10 11 12
fourth pill from top, slightly darker gradient: 0 1 2 3 5
sixth pill from top, central in vertical alignment:
bottom-most turquoise pill with soft gray outline: 6 7 8 9
Elements — click to highlight
| # | Tag | Concept | Purity | Contributions |
|---|---|---|---|---|
| 0 | rect |
fourth pill from top |
0.283
|
0.119 0.141 0.137 0.101 |
| 1 | rect |
fourth pill from top |
0.275
|
0.107 0.123 0.118 0.099 |
| 2 | rect |
fourth pill from top |
0.272
|
0.105 0.118 0.110 0.101 |
| 3 | rect |
fourth pill from top |
0.260
|
0.097 0.104 0.099 0.099 |
| 4 | rect |
third pill in stack |
0.256
|
0.105 0.103 0.101 0.101 |
| 5 | rect |
fourth pill from top |
0.256
|
0.108 0.109 0.108 0.100 |
| 6 | rect |
bottom-most turquois |
0.258
|
0.097 0.091 0.098 0.099 |
| 7 | rect |
bottom-most turquois |
0.274
|
0.094 0.084 0.089 0.100 |
| 8 | rect |
bottom-most turquois |
0.291
|
0.091 0.073 0.078 0.100 |
| 9 | rect |
bottom-most turquois |
0.342
|
0.077 0.054 0.061 0.100 |
| 10 | rect |
third pill in stack |
1.000
|
0.000 0.000 0.000 0.000 |
| 11 | rect |
third pill in stack |
1.000
|
0.000 0.000 0.000 0.000 |
| 12 | rect |
third pill in stack |
1.000
|
0.000 0.000 0.000 0.000 |
SVG Code
<svg width="200" height="400" xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient id="pillGradient" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" stop-color="#e6f7ff" />
<stop offset="100%" stop-color="#00c8c8" />
</linearGradient>
</defs>
<!-- Background (transparent by default) -->
<!-- Pill-shaped elements -->
<!-- Each pill is 160px wide and 30px tall with 15px corner radius -->
<!-- Spaced vertically with 10px gaps -->
<!-- Row 1 -->
<rect x="20" y="10" rx="15" ry="15" width="160" height="30" fill="url(#pillGradient)" stroke="#cccccc" stroke-width="1"/>
<!-- Row 2 -->
<rect x="20" y="50" rx="15" ry="15" width="160" height="30" fill="url(#pillGradient)" stroke="#cccccc" stroke-width="1"/>
<!-- Row 3 -->
<rect x="20" y="90" rx="15" ry="15" width="160" height="30" fill="url(#pillGradient)" stroke="#cccccc" stroke-width="1"/>
<!-- Row 4 -->
<rect x="20" y="130" rx="15" ry="15" width="160" height="30" fill="url(#pillGradient)" stroke="#cccccc" stroke-width="1"/>
<!-- Row 5 -->
<rect x="20" y="170" rx="15" ry="15" width="160" height="30" fill="url(#pillGradient)" stroke="#cccccc" stroke-width="1"/>
<!-- Row 6 -->
<rect x="20" y="210" rx="15" ry="15" width="160" height="30" fill="url(#pillGradient)" stroke="#cccccc" stroke-width="1"/>
<!-- Row 7 -->
<rect x="20" y="250" rx="15" ry="15" width="160" height="30" fill="url(#pillGradient)" stroke="#cccccc" stroke-width="1"/>
<!-- Row 8 -->
<rect x="20" y="290" rx="15" ry="15" width="160" height="30" fill="url(#pillGradient)" stroke="#cccccc" stroke-width="1"/>
<!-- Row 9 -->
<rect x="20" y="330" rx="15" ry="15" width="160" height="30" fill="url(#pillGradient)" stroke="#cccccc" stroke-width="1"/>
<!-- Row 10 -->
<rect x="20" y="370" rx="15" ry="15" width="160" height="30" fill="url(#pillGradient)" stroke="#cccccc" stroke-width="1"/>
<!-- Row 11 -->
<rect x="20" y="410" rx="15" ry="15" width="160" height="30" fill="url(#pillGradient)" stroke="#cccccc" stroke-width="1"/>
<!-- Row 12 -->
<rect x="20" y="450" rx="15" ry="15" width="160" height="30" fill="url(#pillGradient)" stroke="#cccccc" stroke-width="1"/>
<!-- Row 13 -->
<rect x="20" y="490" rx="15" ry="15" width="160" height="30" fill="url(#pillGradient)" stroke="#cccccc" stroke-width="1"/>
</svg>