웹게임 GOOD LUCK은 옛날 휴대용 LCD 게임기처럼 보이도록 만들었습니다. 이미지 파일은 거의 쓰지 않고 CSS만으로 화면을 구성했습니다. 직접 써보고 효과가 좋았던 기법들을 정리합니다.1. LCD 화면의 격자 무늬LCD는 가까이서 보면 픽셀 사이에 가는 격자가 보입니다. 이걸 repeating-linear-gradient 두 개로 가로, 세로 줄을 겹쳐서 만들었습니다. 3px마다 1px짜리 아주 옅은 선입니다..lcd { background: #b9c5a5; background-image: repeating-linear-gradient(0deg, rgba(0,0,0,.05) 0 1px, transparent 1px 3px), repeating-linear-gradient(90deg..