Cyber — AI Security
A premium AI-cybersecurity landing page — light liquid-glass design, an interactive threat dashboard, and its own system-aware dark mode.
- Role
- Concept + design + build
- Services
- UI/UX design · Creative frontend · Motion design · Design systems
- Year
- 2026
- Status
- Concept build
Overview
The brief
Security marketing trends dark and fearful. I wanted the opposite: a calm, premium, light interface that still feels technical and trustworthy, with one interactive moment that proves the product rather than describing it.
An original concept project. Brand and content created for the build.
Approach
How I built it
Designed a light liquid-glass system with an amber accent and a 'detect · defend · respond' hero triad.
Built an interactive threat dashboard so visitors can feel the product working instead of reading a feature list.
Added a system-default + persisted dark mode using channel-based CSS-variable tokens, so the whole palette flips cleanly.
Used a compressed cinematic hero video and motion components (FadingVideo, BlurText, Parallax) tuned to stay fast.
Key features
What makes it work
- Light liquid-glass design language
- Interactive threat dashboard
- System-aware, persisted dark mode
- Motion component kit (FadingVideo / BlurText / Parallax)
Gallery
A closer look
Build
Under the hood
- Light + dark themes verified on desktop and mobile
- Clean console; compressed hero video
Reflection
Looking back
Proof that a 'serious' category can be premium and bright. The channel-based token system from this build is what powers the dark mode on this very portfolio.