Design Atlas
한국어
▞ Patterns & textiles

Argyle

아가일

Interlocking colour diamonds crossed by thin diagonal overstitch lines — named for the Argyll region of Scotland.

Also known as: 다이아몬드 체크Diamond check
···
html
<div class="ar"></div><span class="tag">argyle</span>
css
.ar{position:absolute;inset:0;background-color:#c9a227;
  background-image:
    repeating-linear-gradient(45deg,transparent 0 28px,rgba(255,255,255,.65) 28px 30px,transparent 30px 60px),
    repeating-linear-gradient(-45deg,transparent 0 28px,rgba(255,255,255,.65) 28px 30px,transparent 30px 60px),
    repeating-conic-gradient(from 45deg,#c9a227 0deg 90deg,#a8811d 90deg 180deg);
  background-size:60px 60px;
  animation:pan 12s linear infinite}
@keyframes pan{to{background-position:60px 60px,60px 60px,60px 60px}}
.tag{position:absolute;left:10px;bottom:8px;padding:3px 9px;border-radius:999px;background:rgba(60,45,10,.82);
  color:#fdf3d0;font:600 10px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.03em}

The diamond lattice was lifted from the tartan of Clan Campbell's home region, Argyll, and transplanted into knitwear — mostly socks — in the early 20th century. Pringle of Scotland put it on golf sweaters in the 1920s, and that's where today's "preppy" association comes from.

The structure has two layers. The base is a diamond lattice alternating two or three colours; laid over it are two thin diagonal lines (the "overstitch") crossing through the centre of each diamond. That overstitch is the detail that reads as "knitted" rather than just a flat diamond check — remove it and it's just a diamond check.

In CSS, a repeating-conic-gradient alternating two colours every 90° builds the diamond lattice; two thin repeating-linear-gradients at 45° and −45° laid on top add the overstitch.

When to use

Use for golf/sock texture and preppy, collegiate-mood branding. Keep the overstitch colour clearly distinct — low contrast makes it vanish and the pattern goes flat.