taste-skill / Components / Turso Cards
Turso Card Component Styles
8 Turso card containers extracted from turso.tech: backgrounds, 12px/16px radii, borders and shadows, rendered live with CSS and Tailwind code.
Source: computed styles extracted from
https://turso.tech on 2026-10-26 by the taste-skill extractor. Brand fonts may be proprietary; previews fall back to Inter / system fonts. Turso is a trademark of its owner; this page documents publicly visible styling for reference and is not affiliated with Turso.Rendered on the Turso canvas
Card 1
radius 12px · padding 0px 0px
Card 2
radius 12px · padding 0px 0px
Card 3
radius 12px · padding 12px 12px
Card 4
radius 16px · padding 20px 20px
Card 5
radius 16px · padding 0px 0px
Card 6
radius 12px · padding 28px 28px
Card 7
radius 16px · padding 0px 0px
Card 8
radius 16px · padding 0px 0px
Card specs
| # | Background | Border | Radius | Padding | Shadow |
|---|---|---|---|---|---|
| 1 | #0D1318 | 1px solid rgba(40, 57, 69, 0.8) | 12px | 0px 0px | rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.1) 0px 8px 10px -6px |
| 2 | transparent | 1px solid rgba(40, 57, 68, 0.6) | 12px | 0px 0px | none |
| 3 | transparent | 2px solid #3A4E5C | 12px | 12px 12px | none |
| 4 | rgba(14, 20, 24, 0.5) | 1px solid rgba(40, 57, 68, 0.6) | 16px | 20px 20px | none |
| 5 | #0F1317 | 1px solid rgba(40, 57, 68, 0.6) | 16px | 0px 0px | none |
| 6 | rgba(14, 20, 24, 0.5) | 1px solid rgba(40, 57, 68, 0.6) | 12px | 28px 28px | none |
| 7 | transparent | 1px solid rgba(217, 70, 239, 0.7) | 16px | 0px 0px | none |
| 8 | transparent | 1px solid rgba(78, 248, 209, 0.7) | 16px | 0px 0px | none |
Copy-paste code
Card 1
.card-turso-1 {
background:#0D1318;
border:1px solid rgba(40, 57, 69, 0.8);
border-radius:12px;
padding:20px;
box-shadow:rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.1) 0px 8px 10px -6px;
}Card 2
.card-turso-2 {
background:transparent;
border:1px solid rgba(40, 57, 68, 0.6);
border-radius:12px;
padding:20px;
}Card 3
.card-turso-3 {
background:transparent;
border:2px solid #3A4E5C;
border-radius:12px;
padding:12px 12px;
}Card 4
.card-turso-4 {
background:rgba(14, 20, 24, 0.5);
border:1px solid rgba(40, 57, 68, 0.6);
border-radius:16px;
padding:20px 20px;
}More Turso
Same component, other brands
Get all 30 full SKILL.md specs (Cursor / Claude Code / Codex ready) plus the Pro growth skills.
See taste-skill Pro →