该技能用于使用 Tailwind CSS 构建电商界面，覆盖商品展示、商品列表、分类与筛选、购物车、结账流程、订单管理、定价与促销、店铺导航以及无障碍等场景。
主要能力：商品卡片提供简单网格、带详情、横向、快速查看浮层、特色卡等变体，配套图片宽高比（aspect-square、aspect-[3/4]）、object-cover、悬停缩放、懒加载；价格展示含原价、促销价、价格区间与 whitespace-nowrap；评分支持实心/空心/半星与评价数量。商品列表提供响应式网格、双列、列表视图、瀑布流及骨架屏、加载更多、分页、空状态。分类筛选含桌面侧边栏、移动端抽屉式对话框、筛选标签与排序下拉。购物车含商品行、数量选择、汇总面板、迷你购物车抽屉、角标与更新态。结账含步骤进度、双列表单、支付字段、订单复核与提交加载。订单管理含订单历史表与移动端堆叠卡、状态徽章、时间线、发票布局。还涵盖促销折扣角标、定价卡、信任图标、优惠码输入，以及店铺页头、Mega Menu、分类预览、面包屑。无障碍部分要求图片描述性 alt、促销价 aria-label、购物车更新 aria-live、数量按钮标签、评分文本替代、表单错误 aria-describedby、结账步骤 aria-current、对话框焦点陷阱等，并附常见错误修正。
使用方式：按文档提供的类名与结构片段，在 Tailwind 项目中直接套用对应模式；也可通过 frontend-components MCP 服务检索组件，例如 search_components(query: "product", framework: "hyperui") 或 search_components(query: "pricing")。
限制：资料未提供安装命令、Tailwind 版本要求、框架兼容范围、收费或价格信息；具体业务逻辑与后端数据接口需自行实现。