CYBERPUNK

High tech, low life. Neon-soaked dystopian futures rendered in electric colors and digital glitches.

JACK IN

CYBERSPACE ELEMENTS

NEON GLOW

Electric cyan, magenta, and yellow create the signature cyberpunk atmosphere.

GRID SYSTEMS

Digital grids and wireframes evoke virtual reality and computer interfaces.

GLITCH EFFECTS

Digital corruption and distortion add authenticity to the cyber aesthetic.

DIGITAL DYSTOPIA

Cyberpunk aesthetics blend noir atmosphere with futuristic technology, creating a world where humanity and technology blur together in neon-lit cityscapes.

2077

ENTER THE MATRIX

CONNECT

AI 프롬프트 예제

Claude/Cursor를 사용하여 Cyberpunk 스타일의 컴포넌트를 생성할 때 참고하세요.

요구사항

네온 glow 효과 (cyan, magenta, yellow)
그리드 배경 또는 와이어프레임
글리치 효과 (glitch animation)
미래지향적 타이포그래피 (monospace)
다크 배경 (#000 ~ #0a0a0a)
강렬한 색상 대비

제약조건

반응형 디자인 필수
성능 최적화 (애니메이션)
접근성 고려 (깜빡임 효과 주의)

예상 결과

미래적이고 디지털한 느낌
강렬한 네온 glow 효과
역동적인 글리치 애니메이션
사이버스페이스 분위기
몰입감 있는 UI
독특하고 개성 있는 디자인

프롬프트 템플릿

Cyberpunk 스타일의 네온 버튼 컴포넌트를 만들어줘.

요구사항:
- 네온 glow 효과 (text-shadow, box-shadow)
- 글리치 애니메이션 (::before, ::after 활용)
- 그리드 배경 (선택사항)
- 미래지향적 타이포그래피 (monospace 폰트)
- 검은 배경 (#000 또는 #0a0a0a)
- 네온 색상 (cyan #00ffff, magenta #ff00ff, yellow #ffff00)

스타일 가이드:
- background: #000
- color: #00ffff (cyan)
- text-shadow: 0 0 10px #00ffff, 0 0 20px #00ffff
- box-shadow: 0 0 15px #00ffff
- border: 2px solid #00ffff
- font-family: 'Courier New', monospace
- text-transform: uppercase

애니메이션:
- hover: glow 강화
- 글리치 효과 (keyframes)
- 깜빡임 효과 (옵션)

반응형 디자인 필수, 성능 최적화, 접근성 고려해줘.