taste-skill / Components / Ashby Cards
Ashby Card Component Styles
3 Ashby card containers extracted from ashbyhq.com: backgrounds, 6px/16px/8px radii, borders and shadows, rendered live with CSS and Tailwind code.
Source: computed styles extracted from
https://www.ashbyhq.com on 2026-10-26 by the taste-skill extractor. Brand fonts may be proprietary; previews fall back to Inter / system fonts. Ashby is a trademark of its owner; this page documents publicly visible styling for reference and is not affiliated with Ashby.Rendered on the Ashby canvas
Card 1
radius 6px · padding 20px 26px
Card 2
radius 16px · padding 64px 64px
Card 3
radius 8px · padding 0px 0px
Card specs
| # | Background | Border | Radius | Padding | Shadow |
|---|---|---|---|---|---|
| 1 | #FFFFFF | 1px solid #F4F4F4 | 6px | 20px 26px | rgba(172, 171, 171, 0.3) 0px -1px 10px 0px |
| 2 | transparent | none | 16px | 64px 64px | rgba(20, 20, 21, 0.18) 0px 0px 1px 0px, rgba(20, 20, 21, 0.3) 0px 2px 3px -2px |
| 3 | transparent | none | 8px | 0px 0px | rgba(20, 20, 21, 0.18) 0px 0px 1px 0px, rgba(20, 20, 21, 0.3) 0px 2px 3px -2px |
Copy-paste code
Card 1
.card-ashby-1 {
background:#FFFFFF;
border:1px solid #F4F4F4;
border-radius:6px;
padding:20px 26px;
box-shadow:rgba(172, 171, 171, 0.3) 0px -1px 10px 0px;
}Card 2
.card-ashby-2 {
background:transparent;
border:1px solid #EEEDEF;
border-radius:16px;
padding:64px 64px;
box-shadow:rgba(20, 20, 21, 0.18) 0px 0px 1px 0px, rgba(20, 20, 21, 0.3) 0px 2px 3px -2px;
}Card 3
.card-ashby-3 {
background:transparent;
border:1px solid #EEEDEF;
border-radius:8px;
padding:20px;
box-shadow:rgba(20, 20, 21, 0.18) 0px 0px 1px 0px, rgba(20, 20, 21, 0.3) 0px 2px 3px -2px;
}More Ashby
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 →