It can be quite hard to create cyberpunk, sci-fi, and futuristic styled UI interfaces from scratch. Some things are easier, other things, such as glitches and moving parts are a lot harder. That’s why you should consider using this cyberpunk UI-kit.
This cyberpunk UI-kit is called Augmented-UI, and was created by James0x57. The kit is a CSS-based UI-kit. Here’s how James describes it himself:
Traditional Sci-Fi web design is tedious and difficult to scale, requiring extra elements or images for each clip, all rotated and carefully positioned to cover corners, often required to match against solid color backgrounds and solid color borders to stay hidden. augmented-ui removes all these limitations.
augmented-ui.com/docs/
You can find the project here:
The Augmented-UI Project
Link > http://augmented-ui.com/
Some examples of how you can use the cyberpunk UI-kit
1. Create a border glow and gradients on elements
2. Combine it with dynamic 3D components
3. And lots of other cool stuff
You can find the GitHub repo here >
Thank you for reading!
Interested in reading more?
Here are some of my other articles related to cyberpunk and design:
Pingback: WEEKLY DESIGN INSPIRATION X2 _ CARL HAUSER | Wendy Zhou
Pingback: Veckans UX/UI Design Inspiration X2 _ Carl Hauser | Wendy Zhou