AppPie

#Developers RetroUI: 复古风格的现代网页应用 UI 组件库 🔗GitHub RetroUI 是一个基于 React 和 Tailwind CSS 构建的复古风格 UI 组件库，为现代网页应用提供独特的视觉体验。这个库将怀旧的设计元素与当代 Web 开发实践相结合，让开发者能够轻松创建具有复古美感的界面。 主要特点 - 复古设计：利用怀旧设计元素创造独特的复古外观和感觉 - 开箱即用：提供 40+ 个可直接复制粘贴到项目中的组件 - Tailwind CSS：基于 Tailwind 构建，便于自定义和样式调整 - 类型安全：所有组件都提供 TypeScript 支持 - 现代兼容：专为现代 Web 应用量身定制 适用场景 RetroUI 特别适合希望在网站设计中脱颖而出的开发者。正如创建者所说，当今大多数 UI 库看起来非常通用且难以区分，而 RetroUI 提供了一种独特的视觉风格，帮助网站在视觉上有所突破。 开源许可证 MIT License。 #GitHub#OpenSource#React#TailwindCSS#UI#Components#TypeScript 📮 频道 @AppPie

#Developers Origin UI: 基于 Tailwind CSS 和 React 的可复用组件库 🔗GitHub Origin UI 是一个丰富的可复制粘贴组件集合，用于快速构建应用程序界面。由 Tailwind CSS 和 React 提供支持，提供免费、开源且随时可以集成到项目中的组件。 该库于 2025 年 2 月 25 日更新至 Tailwind CSS v4，同时保留了使用 v3 构建的旧版组件。新组件将只为 Tailwind v4 开发。 主要特点 - 设计精美：包含数百个组件，并持续更新新设计 - 无缝集成：专为 Next.js 项目设计，但也兼容任何基于 React 的项目 - 遵循 shadcn 约定：对于使用过 shadcn 的开发者来说感觉熟悉 - 提供漂亮的 UI 布局：帮助你快速启动下一个项目 使用方法 使用非常简单，只需将 Origin UI 的 .tsx 文件复制到项目的 components/ui 文件夹中，并将 utils.ts 复制到项目的 lib 文件夹中即可。 开源许可证 MIT License。 #React#TailwindCSS#GitHub#OpenSource#UI 📮 频道 @AppPie

#Developers Your Next Store: 基于 Next.js 和 Stripe 的现代电商解决方案 🔗GitHub Your Next Store 是一个开源的电子商务模板，基于 Next.js 构建，以 Stripe 作为后端。它为开发者和商家提供了一种快速创建高性能在线商店的方式，无需复杂的设置和多种技术堆栈的整合。 项目的核心理念是利用 Stripe 作为产品、价格和支付的数据源，使得商家可以专注于业务而非技术实现。通过利用 Next.js 的现代前端技术，该项目提供了超快的加载速度和优秀的用户体验，使其成为构建专业电子商务网站的理想选择。 主要特点 - 生成式商店前端：基于 Stripe 中定义的产品自动生成美观且极速的商店前端 - 内置结账流程：与 Stripe 无缝整合的结账体验 - Link by Stripe：支持两次点击完成结账 - 税收支持：基于位置自动计算 VAT 和 GST - 运费计算：支持固定费率的运费设置 - 即时搜索：每次按键都能获得搜索结果 - 国际化支持：轻松将商店翻译成任何语言 - 产品变体：支持简单的产品变体，如不同尺寸和颜色 - 开发中功能：管理仪表板（即将推出） 技术栈 Next.js、Stripe API、ShadCN UI、Tailwind CSS。 开源许可证 AGPL-3.0 License。 #ECommerce#Nextjs#Stripe#OpenSource#TailwindCSS#ShadCN#GitHub 📮 频道 @AppPie

#Developers tailwindcss-motion: 为 Tailwind 项目添加简洁强大的动画效果 🔗GitHub tailwindcss-motion 是一个为 Tailwind CSS 设计的插件，旨在简化前端动画的创建过程。它提供了一套简单的动画工具集和语法，允许开发者通过预设的动画类或自定义动画来增强用户界面的交互性。 特点 • 简洁的语法设计，无需定义复杂的关键帧 • 提供实用类来内联动画化各个维度 • 包含多种预设动画效果 • 完整的 TypeScript 支持 • 文件体积小，性能高效 扩展工具 Rombo 还提供了 Chrome 扩展，可视化创建动画并导出为 Tailwind 类、纯 CSS 或 Framer Motion 代码。 该插件适用于需要在 Tailwind 项目中添加精美动画效果的开发者，无需学习复杂的动画框架，通过简单的类名组合即可实现专业级动效。 #GitHub#OpenSource#TailwindCSS#Animation 📮 频道 @AppPie

#Developers Tailwind CSS v4.0 正式版发布 🔗TailwindCSS Blog 这是框架的全新版本，专注于性能和灵活性的优化，重新设计了配置和定制体验，并充分利用了 Web 平台的最新进展。 主要特性 • 全新高性能引擎：完整构建速度提升最多 5 倍，增量构建速度提升超过 100 倍，构建时间以微秒计。 • 为现代 Web 而设计：基于最前沿的 CSS 特性构建，包括 cascade layers、使用 @property 注册的自定义属性、以及 color-mix() 等功能。 • 简化的安装流程：更少的依赖，零配置，在 CSS 文件中只需一行代码。 • 官方 Vite 插件：紧密集成以实现最佳性能和最简配置。 • 自动内容检测：自动发现所有模板文件，无需配置。 • 内置导入支持：无需额外工具即可打包多个 CSS 文件。 • CSS 优先配置：全新的开发体验，直接在 CSS 中而不是 JavaScript 配置文件中自定义和扩展框架。 • CSS 主题变量：所有设计令牌都作为原生 CSS 变量暴露，可在任何地方访问。 • 动态工具类值和变体：不再需要猜测间距比例中存在哪些值，也不需要为基本的数据属性扩展配置。 • 现代化的 P3 调色板：重新设计的更生动的调色板。 • 容器查询：无需插件即可基于容器大小设置元素样式的一级 API。 • 新的 3D 变换工具类：直接在 HTML 中在 3D 空间转换元素。 • 扩展的渐变 API：支持径向和锥形渐变、插值模式等。 • @starting-style 支持：新的变体，可用于创建进入和退出过渡，无需 JavaScript。 • not-* variant：仅当元素不匹配其他变体、自定义选择器或媒体/特性查询时设置样式。 • 更多新工具类和变体：包括对 color-scheme、field-sizing、复杂阴影、inert 等的支持。 现在就可以通过在 新项目中安装 或直接通过浏览器的 Tailwind Play 使用 Tailwind CSS v4.0。 对于现有项目，Tailwind Labs 发布了一份全面的 升级指南 ，并构建了一个 自动升级工具 ，帮助你尽可能快速、无痛地升级到最新版本。 #TailwindCSS 📮 频道 @AppPie

#Apps RSS.Beauty: 让 RSS 变漂亮 🔗GitHub RSS.Beauty 是一个基于 XSLT 技术的 RSS 美化工具, 可以将普通的 RSS/Atom 订阅源转换成美观的阅读界面。 主要特性 • 技术栈: Astro, Tailwind CSS, XSLT • 精美的阅读界面，响应式设计 • 支持 RSS 2.0 和 Atom 1.0 • 方便订阅到多个 RSS 阅读器 • 支持自部署 部署 • 通过 Vercel, Cloudflare Pages, Netlify 等平台部署 • 通过 Docker 部署 开源许可证 AGPL-3.0 license #GitHub#OpenSource#RSS#TailwindCSS 📮 频道 @AppPie

📌AppPie 频道置顶 🌐 网站 apppie.com 欢迎来到 AppPie！我们致力于数字生活方式，关注 Apple 生态更新，分享效率工具和实用方法，探索设计与开发资源。 关联频道 • Apple 软件更新 @AppleSystemUpdates • Apple Newsroom @AppleNewsrooms 🔍内容索引 以下是一些标签，帮助你快速导航频道内容。 #Apple • 软件更新 #AppleSoftwareUpdate • 固件更新 #AppleFirmwareUpdate • 零售 #AppleRetail#AppleStore • 活动 #AppleEvent • 开发者 #AppleDeveloper#WWDC • 新闻 #AppleNewsroom • 健康与健身 #AppleFitness#AppleWatchChallenge • 技术支持 #AppleSupport • 网站 #AppleWebsite • 娱乐 #AppStore#AppStoreAwards#AppleMusic#AppleMusicReplay#AppleArcade • 服务 #iCloud#ApplePay #Apps • 应用更新 #AppUpdates • Notion 更新 #Notion#NotionUpdates • Telegram 更新 #Telegarm #Developers #OpenSource#GitHub #React#Nextjs#TailwindCSS #TypeScript#SaaS#Cloudflare 💬 讨论群 @AppPieGroup 📮 频道 @AppPie

Tailwind CSS v4.0 Beta 1 发布 Tailwind CSS v4.0 是一个全新设计的引擎，专注于性能优化，并完美适配现代 Web。 • 性能至上 —— 新引擎的完整构建速度提高了多达 5 倍，增量构建速度更是提升了超过 100 倍，速度快到微秒级。 • 一体化工具链 —— 内置 import 处理、vender prefixing 和语法转换，无需额外依赖工具。 • CSS 优先体验 —— 全新的开发者体验，直接在 CSS 中自定义和扩展框架，而无需再使用 JavaScript 配置文件。 • 现代 Web 支持 —— 原生支持层叠样式层、广色域颜色，并内置现代 CSS 特性，如容器查询、@starting-style 和 popovers 弹出层等功能。 在今天发布的全新 Beta 文档中找到所有上手指南： 立即开始使用 Tailwind CSS v4.0 Beta 1 → #TailwindCSS 📮 频道 @AppPie

tailwindcss-animate —— 为 Tailwind CSS 创建优美动画的插件 🔗GitHub 安装 通过 npm 安装，并在 tailwind.config.js 文件中添加插件： npm install -D tailwindcss-animate 使用方法 详见 README 中的文档部分。 许可证 MIT license。 #GitHub#TailwindCSS#OpenSource#Animation 📮 频道 @AppPie

#Developers Eldora UI: 基于 React, Tailwind CSS 的开源动画组件 🔗GitHub Eldora UI 提供了一系列开源动画组件，使用 React、Typescript、Tailwind CSS 和 Framer Motion 构建。完全开源，且可以根据需要进行定制。 探索组件 访问 eldoraui.site/components 查看文档。 许可证 MIT 许可证。 #React#TailwindCSS#GitHub#OpenSource 📮 频道 @AppPie

#Developers Animata：粘贴即用的交互动画和视觉效果库 🔗GitHub Animata 是一个免费开源的精选动画库，收集了来自互联网的交互动画和视觉效果，支持无缝复制粘贴到你的项目中。 特点 • 免费开源，手工精选 • 使用 React、Framer Motion 和 Tailwind CSS 构建 • 即用即粘贴 • 可自定义设计 使用方式 无需安装依赖，类似 shadcn/ui，直接复制代码到项目中使用 项目要求 • TailwindCSS（必需）：样式支持 • Framer Motion（可选）：复杂动画 • Lucide Icons/Radix Icons（可选）：图标支持 注意：Animata 不是完整的 UI 库，而是一个可以增强项目设计的动画和效果集合。可以与其他 UI 库或设计系统配合使用（需要配置 TailwindCSS）。 许可证 MIT license。 #GitHub#TailwindCSS#OpenSource#Animation 📮 频道 @AppPie

#DeveloperTools Headless UI v2.0 for React 发布 Headless UI v2.0 为 React 开发者带来了许多新特性和改进，旨在简化开发流程并增强用户界面的灵活性和可访问性。 这个版本带来了许多优秀的新功能，包括： • 内置的锚点定位 • 新的 checkbox 组件 • HTML 表单组件 • 改进的悬停、聚焦和活动状态检测 • 组合框列表虚拟化 • 新网站和改进的文档 来源 #TailwindCSS#HeadlessUI#React 📮 频道 @AppPie