| <!DOCTYPE html> |
| <svg width="200" height="200"> |
| <linearGradient id="g" x2="0" y2="1"> |
| <stop offset="0" stop-color="red"/> |
| <stop offset="1" stop-color="blue"/> |
| </linearGradient> |
| <pattern id="p" width="0.25" height="0.25" viewBox="0 0 10 10"> |
| <rect width="5" height="5"/> |
| <rect x="5" y="5" width="5" height="5"/> |
| </pattern> |
| <g transform="scale(10)"> |
| <rect x="2.5" y="2.5" width="4" height="4" |
| fill="url(#g)" stroke="url(#g)" |
| vector-effect="non-scaling-stroke" stroke-width="10" |
| paint-order="stroke fill"/> |
| |
| <rect x="10" y="2.5" width="4" height="4" |
| fill="url(#p)" stroke="url(#p)" |
| vector-effect="non-scaling-stroke" stroke-width="10" |
| paint-order="stroke fill"/> |
| </g> |
| </svg> |
