M4RKYU.SYSEdition 2027
Skip to content
LOCZH/安大略 · 加拿大/▸topics · design待机OK/--:--:--EST
M4M4RK_YUportfolio
  • 创作创作
    创作Overview
    • 作品精选案例与项目记录
    • 游戏可玩原型与游戏开发日志
  • 影像影像
    影像Overview
    • 照片影像合集与视觉实验
    • 商店印刷品、海报和限量物件
  • 写作写作
    写作Overview
    • 博客长篇开发日志与现场笔记
    • 笔记短观察、链接与代码片段
  • 资源资源
    资源Overview
    • 工具38 款浏览器内开发工具
    • 链接每日使用的开发与设计书签
  • 关于关于
  • 联系联系
EN
design
2-Colour · Riso Proof

主题

标记为「design」

42 篇

全部主题
  • 资源AI
    v0Vercel's UI generator — describe a screen, get React + shadcn output you can edit. Useful for breaking a blank-page block, not as a final component source.
  • 资源Color
    CoolorsTap-to-lock palette generator with contrast, shading, and export to CSS variables. Fastest way to draft a five-color palette that doesn't look extruded from a stock illustration.
  • 资源Color
    Realtime ColorsLive-preview a full palette on a sample landing page before committing to tokens. Picking accent colors against actual UI beats squinting at hex swatches.
  • 资源Icons
    HeroiconsTailwind Labs' MIT-licensed SVG icon set — outline, solid, and mini variants. When I need a clean, neutral icon and don't want to argue about line weights.
  • 资源Icons
    LucideCommunity-driven Feather fork with 1,500+ icons and tree-shakable React bindings. The icon set this site already uses — search before reinventing a glyph.
  • 资源Icons
    Phosphor IconsSix-weight icon family with consistent geometry across the whole set. When the project's accent demands something curvier than Lucide.
  • 资源Color
    UI ColorsGenerate full Tailwind shade scales from a single hex. Turning a brand color into a 50-950 ramp without doing it by hand.
  • 资源Color
    Tints and ShadesGenerate evenly stepped tints and shades for any base color. Sometimes you just need ten ticks lighter and ten ticks darker, no algorithm theatre.
  • 资源Inspiration
    MobbinSearchable screenshot library of real iOS, Android, and web product flows. Before designing a new flow, see how five mature products already solved it.
  • 资源Inspiration
    SiteInspireCurated showcase of well-designed websites, taggable by style and type. Lower noise than Awwwards when I'm scouting layout and typography ideas.
  • 资源Inspiration
    AwwwardsThe trophy-case site for ambitious web work, often heavy on motion and WebGL. Useful sometimes; mostly a calibration check for what counts as overproduced.
  • 资源Inspiration
    Page FlowsRecorded onboarding and product flows from real apps, frame by frame. The clearest way to study how shipped products handle empty states and edge transitions.
  • 资源Inspiration
    Land-bookGallery of landing pages filtered by style, type, industry, and color. Quick reference when I need ten variations on a hero before writing one.
  • 资源Utility
    CarbonRender code snippets as polished images for docs, slides, or social posts. When a screenshot of code needs to look like a screenshot of code, not a Word document.
  • 资源Tool
    Shadow GeneratorLive box-shadow builder — drag the sliders, copy CSS or a Tailwind arbitrary class. Inset toggle, any CSS color. Shadow stacks are easier to feel than to read, and the Tailwind arbitrary-value syntax is fiddly to type by hand.
  • 资源Tool
    Gradient GeneratorMulti-stop linear and radial gradients with live preview, drag-to-reorder stops, and CSS + Tailwind output. Skip the round-trip to Coolors when you just want a quick hero gradient with the project's accent.
  • 资源Tool
    CSS TriangleBorder-trick triangle generator. Pick direction, size, and color; copy a ready-to-paste rule. Speech-bubble carets and tooltip arrows show up in every UI; remembering the border hack does not.
  • 资源Tool
    GlassmorphismLive backdrop-filter preview — blur, saturation, tint, border, radius — with copyable CSS. Frosted-glass cards are a four-property combo; iterating live beats guessing pixel values.
  • 资源Tool
    Border RadiusFour-corner border-radius editor with linked toggle, live preview, and CSS + Tailwind arbitrary-class output. Asymmetric radii are awkward to type out; this makes them point-and-click.
  • 资源Tool
    Color Palette ExtractorDrop or upload an image; pull its N most-prominent colors via median-cut quantization. Runs entirely in the browser. Sampling brand colors out of a screenshot without an Adobe round-trip — and the file never leaves the page.
  • 影像shenzhen
    Shenzhen / 11Photographed in Shenzhen on January 13, 2025.
  • 影像shenzhen
    Shenzhen / 12Photographed in Shenzhen on February 6, 2025.
  • 影像shenzhen
    Shenzhen / 13Photographed in Shenzhen on January 12, 2025.
  • 影像shenzhen
    Shenzhen / 14Photographed in Shenzhen on January 27, 2025.
  • 影像shenzhen
    Shenzhen / 15Photographed in Shenzhen on December 14, 2024.
  • 影像shenzhen
    Shenzhen / 16Photographed in Shenzhen on October 31, 2024.
  • 影像shenzhen
    Shenzhen / 17Photographed in Shenzhen on January 8, 2025.
  • 影像shenzhen
    Shenzhen / 18Photographed in Shenzhen on January 2, 2025.
  • 影像shenzhen
    Shenzhen / 19Photographed in Shenzhen on October 30, 2024.
  • 影像shenzhen
    Shenzhen / 20Photographed in Shenzhen on December 15, 2024.
  • 影像shenzhen
    Shenzhen / 21Photographed in Shenzhen on February 10, 2025.
  • 影像shenzhen
    Shenzhen / 22Photographed in Shenzhen on January 13, 2025.
  • 影像shenzhen
    Shenzhen / 23Photographed in Shenzhen on February 6, 2025.
  • 影像shenzhen
    Shenzhen / 24Photographed in Shenzhen on January 12, 2025.
  • 影像shenzhen
    Shenzhen / 25Photographed in Shenzhen on January 27, 2025.
  • 影像shenzhen
    Shenzhen / 26Photographed in Shenzhen on December 14, 2024.
  • 影像shenzhen
    Shenzhen / 27Photographed in Shenzhen on October 31, 2024.
  • 影像shenzhen
    Shenzhen / 28Photographed in Shenzhen on January 8, 2025.
  • 影像shenzhen
    Shenzhen / 29Photographed in Shenzhen on January 2, 2025.
  • 影像shenzhen
    Shenzhen / 30Photographed in Shenzhen on January 13, 2025.
  • 笔记repost
    repost noterauno's site is a clinic in interaction detail 🔗 the kind of polish you only really notice when it's missing. been stealing ideas all week.
  • 笔记tierlist
    type i keep reaching forranked by how often it actually lands in a project, not by merit 🔤 ask me again next month
M4RKYUM4RKYUM4RKYUM4RKYUM4RKYUM4RKYUM4RKYUM4RKYU
始于 2024
ZhenXiao Mark YuZhenXiao Mark Yu
联系

看到什么有意思的?和我聊聊。

这是一个作品集,不是服务 · 但每一条留言我都会看 — 如果哪里让你有所触动,或者只想打个招呼,欢迎写信过来。

开启对话
频道开放

随时打个招呼 · 2026

--:--:--EST加拿大 安大略
  • 邮件
  • GitHub
  • dev.to
  • 领英
  • 推特 / X
  • Instagram
  • Facebook
  • YouTube
  • CodePen
  • Spotify
  • Snapchat

订阅

偶尔收到一封简讯

来自 m4rkyu.com 的笔记与日志——简短、标注日期、没有杂音。随时可退订。

作品

线上发布、游戏作品与视觉档案。

  • 项目
  • 游戏
  • 档案
  • 日志

资源

每日好用的工具与个人收藏的链接库。

  • 搜索
  • 最新
  • 工具
  • 链接
  • 笔记
  • 主题
  • 商店
RSSJSON Feed

工作室

背景、联系方式以及合作渠道。

  • 关于
  • 联系
  • 更新日志
  • 技术说明
  • 简历筹备中

社交

在常去的平台上找到我。

  • GitHub
  • dev.to
  • 领英
  • 推特 / X
  • Instagram
  • Facebook
  • YouTube
  • CodePen
  • Spotify
  • Snapchat
  • 邮件
© 2026 ZhenXiao Mark Yumarkyu0615@gmail.com
  • 邮件
  • GitHub
  • dev.to
  • 领英
  • 推特 / X
  • Instagram
  • Facebook
  • YouTube
  • CodePen
  • Spotify
  • Snapchat
隐私条款由 Next.js 16 · React 19 · Tailwind 4 构建