멤피스 디자인 패턴 랜딩 키트, 점·물결 섹션 9개
멤피스 디자인은 1980년대 밀라노에서 시작된, 점·물결선·지그재그 같은 기하 형상을 밝은 색 위에 물들이듯 반복하는 스타일입니다. 이 글은 이미지 한 장 없이 CSS 그라디언트 타일과 도형만으로 멤피스 패턴을 재현
읽기요즘 유행하는 홈페이지 스타일을 부품 9개와 전체 템플릿으로
멤피스 디자인은 1980년대 밀라노에서 시작된, 점·물결선·지그재그 같은 기하 형상을 밝은 색 위에 물들이듯 반복하는 스타일입니다. 이 글은 이미지 한 장 없이 CSS 그라디언트 타일과 도형만으로 멤피스 패턴을 재현
읽기스큐어모피즘 디자인은 가죽·금속·나무 같은 실물 질감을 화면에 옮겨 담는 스타일입니다. 사진 한 장 없이 가죽·금속·나무를 CSS 값만으로 만들어, 2024년 이후 제품 사이트에서 한두 군데씩 다시 돌아온 그 질감을
맥시멀리즘 디자인은 여백을 비우는 대신 색면·큰 활자·스티커를 겹쳐 붙여 화면을 꽉 채우는 스타일입니다. 잡지에서 오려 붙인 콜라주가 그 대표 얼굴이고, 이 키트는 사진 파일 없이 CSS 값만으로 그 인상을 냅니다.
종이 질감 디자인은 색종이를 가위로 오려 붙인 것처럼 면마다 흐림 없는 그림자로 두께를 주고, 색은 다섯 가지 안에서만 쓰는 스타일입니다. 종이 사진을 깔지 않고 그림자 값 하나만으로 종이처럼 보이게 만드는 것이 전
saas 랜딩페이지 디자인은 흰색과 오프화이트 두 톤 배경 위에 파란색 브랜드 컬러 하나만 얹고, 그림자는 회색 계열로 얕게, 모서리는 절제된 반경으로 통일해 화려하지 않으면서도 진지해 보이게 만드는 스타일입니다.
청량한 디자인은 오렌지·라임·자몽·레몬처럼 채도 높은 과일 색을 크림 바탕 위에 얹고, 카드마다 같은 계열의 진한 색 그림자를 드리워 파스텔보다 더 쨍하고 여름 음료 브랜드처럼 싱그럽게 보이게 만드는 스타일입니다.
손그림 디자인은 굵고 삐뚤빼뚤한 크레용 선으로 테두리를 그리고, 그 선만 SVG 필터로 살짝 흔들어 종이 위에 손으로 그은 낙서처럼 보이게 만드는 스타일입니다. 동네 미술학원이나 어린이 브랜드 사이트에서 본 그 느낌
파스텔 톤 디자인은 크림색 바탕 위에 버블검 핑크·피치·레몬·민트·라벤더의 연한 색을 얹고, 그림자까지 회색 대신 같은 계열의 파스텔로 그려 사탕처럼 말랑하고 상큼하게 보이게 만드는 스타일입니다. 디저트 가게나 뷰티
뉴모피즘 디자인은 카드나 버튼의 배경색을 화면 배경과 거의 같게 두고, 밝은 그림자와 어두운 그림자를 반대 방향으로 얹어 색이 아니라 그림자만으로 입체감을 만드는 스타일입니다. 이름도 모르고 어떻게 만드는지도 몰랐던
HUD 디자인은 게임이나 SF 영화 속 조준경·레이더처럼, 화면 위에 좌표·상태 수치를 얹어 마치 나를 지켜보고 있는 듯한 인상을 주는 인터페이스 스타일입니다. 이 편은 그 감시 카메라 감성을 실제로 돌아가는 랜딩