Here is a sample of my custom Astro components that can be used when writing MDX content in Astro.

BilibiliVideoCard

加载出错
稍后再看
4:28
吉祥话【2021拜年纪单品】
hanser：哟！新年的一年要天天开心！把去年的坏运气都甩掉呀skrrrrrr！！” 泠鸢yousa：新春快乐！这吉祥话发相亲相爱一家人群岂不太合适了，妙啊！ 祖娅纳惜：祝大家牛年行大运！好吃…不长胖～！ 鹿乃：祝大家新年快乐！希望大家在2021年都能够得到幸福。今年我也要加油哟～！
9097573
14033 
<BilibiliVideoCard id="BV1zp4y1W7qf"/>

SteamCard3D

<SteamCard3DDesk>
  <SteamCard3D src="/images/tarot/bilibili/0.jpg"/>
  <SteamCard3D src="/images/tarot/bilibili/1.jpg"/>
  <SteamCard3D src="/images/tarot/bilibili/2.jpg"/>
  <SteamCard3D src="/images/tarot/bilibili/3.jpg"/>
  <SteamCard3D src="/images/tarot/bilibili/4.jpg"/>
</SteamCard3DDesk>


<SteamCard3DDesk>
  <SteamCard3D src="/images/steam-card/thb-250-plains.png"/>
  <SteamCard3D src="/images/steam-card/thb-251-island.png"/>
  <SteamCard3D src="/images/steam-card/thb-252-swamp.png"/>
  <SteamCard3D src="/images/steam-card/thb-253-mountain.png"/>
  <SteamCard3D src="/images/steam-card/thb-254-forest.png"/>
</SteamCard3DDesk>

Book3D

错误
错误 
<Book3D cover="/images/book-cover/领域驱动设计.jpg" width="220px" height="290px" thickness="30px" color="#ea8722" />
<Book3D cover="/images/book-cover/阿里巴巴Java开发手册.jpg" width="140px" height="200px" thickness="15px" color="#ea8722" />