Techniques
Hard-offset ink card
The signature screen-print look — flat fill, fat ink outline, solid offset shadow that shrinks on hover so the card "presses" down-right.
.ys-card {
background: #FFFFFF;
border: 3px solid #1A1A2E;
border-radius: 20px;
box-shadow: 4px 4px 0 rgba(26, 26, 46, 1);
transition: transform 250ms cubic-bezier(0.34, 1.56, 0.64, 1),
box-shadow 250ms ease;
}
.ys-card:hover {
transform: translate(-2px, -2px);
box-shadow: 8px 8px 0 rgba(26, 26, 46, 1);
}
Rainbow ripple divider
The wavy multi-stripe ribbon that ripples across Pepperland — pure hard-edged bands, no blur.
.ys-rainbow-divider {
height: 24px;
border-radius: 9999px;
border: 3px solid #1A1A2E;
background: repeating-linear-gradient(
90deg,
#E5197B 0 40px, #F26522 40px 80px, #FFD400 80px 120px,
#3FA535 120px 160px, #2AA9E0 160px 200px, #7B2D8B 200px 240px
);
}
Pop-Art halftone wink
An optional faint dot field as a Pop-Art nod — a whisper of litho printing over a flat block, never a texture that muddies the color.
.ys-halftone {
background-color: #FFD400;
background-image: radial-gradient(rgba(26,26,46,0.14) 2px, transparent 2px);
background-size: 14px 14px;
}