RAW.
BOLD.
LOUD.
The Standard Template. High-contrast. Unapologetic.
01 // The Cards
Basic Card
Standard container with hard shadows. Used for general content.
FEATURED
Highlight
High visibility container for critical alerts or featured items.
System Status
CPU Load98%
Memory42%
DiskFULL
Activator Code:
css
1
2
3
.style-neo-card {
@apply bg-white border-4 border-black shadow-[8px_8px_0px_0px_rgba(0,0,0,1)];
}
02 // The Buttons
Activator Code:
css
1
2
3
.style-neo-btn {
@apply bg-brand-primary border-4 border-black shadow-[4px_4px_0px_0px_rgba(0,0,0,1)] hover:translate-x-[2px] hover:translate-y-[2px] hover:shadow-none transition-all;
}
03 // The Input
Secure ConnectionPort 8080
Activator Code:
css
1
2
3
.style-neo-input {
@apply border-4 border-black p-4 font-bold text-xl shadow-[4px_4px_0px_0px_rgba(0,0,0,1)];
}
04 // The Table
| ID | User | Role | Status |
|---|---|---|---|
| #001 | Neo | The One | Active |
| #002 | Trinity | Admin | Active |
| #003 | Smith | Agent | Rogue |
Activator Code:
css
1
2
3
.style-neo-table {
@apply w-full bg-white border-4 border-black shadow-[12px_12px_0px_0px_rgba(0,0,0,1)];
}
05 // The Modal
Close [X]
System Failure
CRITICAL ERROR DETECTED IN SECTOR 7G. INITIATE PROTOCOL OMEGA?
Activator Code:
css
1
2
3
.style-neo-modal {
@apply bg-white border-4 border-black p-12 shadow-[16px_16px_0px_0px_rgba(0,0,0,1)];
}
Token Map
css
1
2
3
4
5
6
.style-neo-card {
@apply border-4 border-black shadow-[8px_8px_0px_0px_rgba(0,0,0,1)];
}
.style-neo-btn {
@apply border-2 border-black shadow-[4px_4px_0px_0px_rgba(0,0,0,1)] hover:translate-x-[2px] hover:translate-y-[2px] hover:shadow-[2px_2px_0px_0px_rgba(0,0,0,1)];
}