最近折腾 UI 老要用到 iOS 那种 squircle(超椭圆)圆角——就是比普通 border-radius 更顺滑、苹果 App 图标那种形状。网上现成工具要么只 能导固定形状,要么要登录,干脆自己写了一个。 地址: https://squirclegenerator.com (纯前端,不用注册,不上传任何东西) 能做的: 拖滑块调宽、高、圆角平滑度(其实就是超椭圆的指数 n) 实时预览 + 选颜色 一键复制 CSS clip-path ,或下载像素级精确的 SVG 带了几个预设:iOS 应用图标、按钮、卡片、头像 实现就是超椭圆公式 |x/a|^n + |y/b|^n = 1 采样生成路径,clip-path 和 SVG 两种输出,整站纯静态零构建。 主要自己用着方便,顺手分享。有不好用或者想加的功能,欢迎拍砖 🙏
本帖使用社区开源推广，符合推广要求。我申明并遵循社区要求的以下内容： 我的帖子已经打上 开源推广 标签： 是 我的开源项目完整开源，无未开源部分： 是 我的开源项目已链接认可 LINUX DO 社区： 是 我帖子内的项目介绍，AI生成、润色内容部分已截图发出： 是 以上选择我承诺是永久有效的，接受社区和佬友监督： 是 以下为项目介绍正文内容，AI生成、润色内容已使用截图方式发出 主贴+前提摘要： 【开源推广】LightBridge - 基于 Sub2API 的强大的的反代理平台，内置 Outlook 号池、注册机，试用送 LDC LightBridge 是一款基于 Sub2API 的反代理工具，支持一键从 Sub2API 迁移 当前 0.1.3 版本 LightBridge 正式支持自定义 CSS+UI 可以直接上传 CSS 文件以应用 UI，还可以更高程度的自定义界面，想怎么用就怎么用。 此外，内置 AGENTS.md，若不想自己配置可以直接把文件丢给 Codex，网站已配置 CLI，AI 能够直接使用。 除此之外，LB 完成了原有 UI 的升级，包括但不限于： 取消了原来顶部菜单栏的边框，使整个页面更加浑然一体 缩小了各个下拉菜单的宽度，使界面实际可用范围增大 修改了部分字体，使界面看起来更加优雅 还修复了几个佬提出的显示 bug 欢迎大家试用！现在迁移到 LB 后可以凭截图领取 LCD/Team 账户～ 这是最新的迁移脚本。目前迁移脚本支持将 Sub2API 直接迁入到最新模块化的 LightBridge 服务当中。自带自动回退功能，会在迁移之前先建立一个完整备份。若迁移失败，支持自动回滚 curl -fsSL https://raw.githubusercontent.com/WilliamWang1721/LightBridge/main/deploy/sub2api-full-migrate.sh | sudo bash -s -- migrate -v v0.0.1 -y 1 个帖子 - 1 位参与者 阅读完整话题
IT之家 6 月 3 日消息，谷歌昨日（6 月 2 日）发布公告，宣布推出 Chrome 149 浏览器稳定版， 主要引入了 CSS 间距装饰 (Gap Decorations)、加强了 bfcache 机制下的 WebSocket 连接管理，并为开发者工具增加了 WebMCP 调试助手。 IT之家注：CSS 间距装饰指在 CSS Grid、Flexbox、多栏布局的 gap 区域中添加线条或装饰的能力。 开发者过去常依赖 border、伪元素、背景图或复杂 CSS，新版可用 column-rule 和 row-rule 直接处理间隙。 该能力还支持 column-rule-inset、row-rule-inset，用于收缩线条端点；也支持 column-rule-visibility-items 和 row-rule-visibility-items，仅在相邻项目之间显示线条。 在支持 CSS 间隙装饰的浏览器中查看时，用户可以看到第一个间隙是虚线，第二个间隙是实线，宽度为 2px，颜色为“#d4d0c8”。 在不支持的浏览器中，这些设置将被忽略。 Chrome 149 还改进 WebSocket（网页套接字）页面与 bfcache（往返缓存）的配合。过去含活跃 WebSocket 连接的页面无法进入 bfcache，用户离开后页面会被丢弃。现在页面进入缓存前会先关闭连接，再保留页面状态。 JavaScript 方面， Intl.Locale （国际化区域设置）新增 variants 属性，可读取和设置 Unicode 区域标识符中的语言变体。 此外，text-overflow: ellipsis 文本在用户编辑或移动光标时，会临时从省略号切换为裁剪显示，便于查看末尾内容。shape-outside 也新增 path ()、shape ()、rect ()、xywh () 等图形函数，文本环绕形状更灵活。
如图，大早晨刚打开看看L站有什么新帖子，就眼前一亮发现UI变了，惊喜之余刷新了一下，原来是我css没加载出来，白高兴了。 2 个帖子 - 2 位参与者 阅读完整话题
好雷霆啊，我的网络应该没问题啊，这css是不是没出来 我还以为今天是黑色主题日哈哈哈 1 个帖子 - 1 位参与者 阅读完整话题
tp-css0tho3sf3n4dayeqq3mn12c8ytm9d16ub5a47gor0dd4ww 1 个帖子 - 1 位参与者 阅读完整话题
最近vibe了个类似视频平台的东西，强制codex给我用原生html js css做前端，类似抖音界面那种，出来效果也是好好的。 就觉得不用框架也挺爽的，就是各位资深的前端老能给分析分析有啥弊端吗？问了codex说是没太要紧。 4 个帖子 - 4 位参与者 阅读完整话题
本帖使用社区开源推广，符合推广要求。我申明并遵循社区要求的以下内容： 我的帖子已经打上 开源推广 标签： 是 我的开源项目完整开源，无未开源部分： 是 我的开源项目已链接认可 LINUX DO 社区： 是 我帖子内的项目介绍，AI生成、润色内容部分已截图发出： 是 以上选择我承诺是永久有效的，接受社区和佬友监督： 是 以下为项目介绍正文内容，AI生成、润色内容已使用截图方式发出 **我突发奇想，在GITHUB上找到高星无人维护的SKILLS，然后利用AI调优成新的会不会有人爱用。我就让多个AI在网上持续 的找找到了一款。佬友们给些反馈。验证一下这个模式可行否。这款软件就是以前前端做交互的。我在对比中发现他比JS更柔性一些。个人用户体验会更好点。 GitHub ：( GitHub - dabaibian/css-skills: Pure CSS hover effects and micro-interaction skills for Claude Code. Zero JS, no SSR issues. · GitHub ) 交互 Demo （可以直接 hover/点击感受效果）( css-skills — Live Demo ) 最后请各位佬友提出宝贵意见认为这个方向是否有可行性。 1 个帖子 - 1 位参与者 阅读完整话题
佬友知道这种是啥效果吗 再复刻呢 玻璃拟态还是动效呢 纯css实现的效果 5 个帖子 - 3 位参与者 阅读完整话题
你是一位就职于苹果公司的顶级前端工程师。请创建一个包含 CSS 和 JavaScript 的 HTML 文件，用于生成动画天气卡片。卡片需要以不同动画效果直观展示以下天气状况： 风力（如：飘动的云朵、摇曳的树木或风线） 降雨（如：下落的雨滴、形成的水洼） 晴天（如：闪耀的光线、明亮的背景） 下雪（如：飘落的雪花、积雪效果） 所有天气卡片需要并排显示，背景采用深色设计。所有 HTML、CSS 和 JavaScript 代码都需包含在这个单一文件中。JavaScript 部分需包含切换不同天气状态的功能（例如通过函数或按钮组），以演示每种天气的动画效果。 将前端显示效果优化得更精致流畅，打造出价值 2000 元 / 月的精品天气应用既视感。 源码 （点击了解更多详细信息） 2 个帖子 - 2 位参与者 阅读完整话题
出网方向做了限制，白名单以外的IP都连不上，有没有什么好的解决办法？试过在白名单机子上开frps把流量转发出去，傻逼windows defender和傻逼TREND逮着我的frpc.exe猛猛杀 1 个帖子 - 1 位参与者 阅读完整话题
本文灵感来源 内嵌HTML代替纯Markdown：让大模型回复不再又臭又长(提示词3.0) cherry 主题来源 分享一些中国风 Cherry Studio 主题皮肤 背景 根据原来题主的方案的直接使用 prompt 的方案在深色模式下有点问题, 比如 优化着优化着发现, Cherry Studio 可以自定义 CSS. (Cherry Studio CSS 全局注入, 注入到应用DOM的全局样式表) 顺着这个思路, 我们可以在 sysprompt 里说明只做格式的映射，外层由 cherry 的 CSS 接管样式。同时这样可以省点token(: 方案 核心思想: 只做格式的映射, 遇到 X 信息类型，用 Y 语义标签. 提示词 （点击了解更多详细信息） css 样式 （点击了解更多详细信息） 最后的效果展示 ps: css样式在这里改: 1 个帖子 - 1 位参与者 阅读完整话题
技术栈 Next.js Tailwindcss Zustand ClerkSupabase Redis RabbitMQ 阿里云 OSS 开源地址 https://github.com/hulk-2019/arcwall 预览地址： http://ai520.wiki 欢迎大家 star! 🙏
技术栈 Next.js Tailwindcss Zustand ClerkSupabase Redis RabbitMQ 阿里云 OSS Stripe(暂未开通) 开源地址 https://github.com/hulk-2019/arcwall 预览地址： http://ai520.wiki 欢迎大家 star! 🙏
技术栈 Next.js Tailwindcss Zustand ClerkSupabase Redis RabbitMQ 阿里云 OSS Stripe(暂未开通) 开源地址 https://github.com/hulk-2019/arcwall 预览地址： http://ai520.wiki 欢迎大家 star! 🙏
技术栈 Next.js Tailwindcss Zustand ClerkSupabase Redis RabbitMQ 阿里云 OSS Stripe(暂未开通) 开源地址 https://github.com/hulk-2019/arcwall 预览地址： http://ai520.wiki 欢迎大家 star! 🙏
技术栈 Next.js Tailwindcss Zustand ClerkSupabase Redis RabbitMQ 阿里云 OSS Stripe(暂未开通) 开源地址 https://github.com/hulk-2019/arcwall 预览地址： http://ai520.wiki 欢迎大家 star! 🙏
技术栈 Next.js Tailwindcss Zustand ClerkSupabase Redis RabbitMQ 阿里云 OSS Stripe(暂未开通) 开源地址 https://github.com/hulk-2019/arcwall 预览地址： http://ai520.wiki 欢迎大家 star! 🙏
技术栈 Next.js Tailwindcss Zustand ClerkSupabase Redis RabbitMQ 阿里云 OSS Stripe(暂未开通) 开源地址 https://github.com/hulk-2019/arcwall 预览地址： http://ai520.wiki 欢迎大家 star! 🙏
技术栈 Next.js Tailwindcss Zustand ClerkSupabase Redis RabbitMQ 阿里云 OSS Stripe(暂未开通) 开源地址 https://github.com/hulk-2019/arcwall 预览地址： http://ai520.wiki 欢迎大家 star! 🙏