Desktop download cards for macOS, Windows and Linux. The card matching the platform prop gets a rotating beam border and the primary button, and every card has a checksum you can copy.
Local-first notes that open in under a second. Free for personal use, syncs only when you ask it to.
macOS 13 Ventura or later. Universal build for Apple silicon and Intel.
Download .dmg148 MBWindows 10 version 1909 or later. 64-bit and ARM64 installers.
Download .exe131 MBUbuntu 22.04, Fedora 38, Debian 12 or newer. x86_64 and arm64.
Download .AppImage156 MBnpx shadcn@latest add https://hyperblur.dev/r/download-platforms.jsonWorks in any React project set up with the shadcn CLI. The file lands in components/hyperblur/download-platforms.tsx.
import { DownloadPlatforms } from "@/components/hyperblur/download-platforms"
<DownloadPlatforms platform="windows" version="4.2.0" onDownload={(id) => track("download", id)} />| Prop | Type | Default | Description |
|---|---|---|---|
| appName | string | "Cinder" | App name used for the icon label. |
| title | string | "Download Cinder for your desktop" | Section headline. |
| subtitle | string | sample text | Paragraph under the headline. Empty string hides it. |
| platform | "macos" | "windows" | "linux" | "macos" | Platform to recommend. Detect it yourself, for example from the user agent on the server, and pass it in. |
| version | string | "4.2.0" | Version shown in the pill above the headline. |
| released | string | "October 28, 2026" | Release date text next to the version. |
| releaseNotes | { label: string; href: string } | null | { label: "Release notes", href: "#" } | Link inside the version pill. Pass null to hide it. |
| allReleases | { label: string; href: string } | null | { label: "Browse all releases", href: "#" } | Link under the cards. Pass null to hide it. |
| platforms | { id: "macos" | "windows" | "linux"; name: string; requirement: string; file: string; size: string; checksum: string; href: string; alternatives?: { label: string; href: string }[] }[] | 3 sample builds | One card per build. alternatives render as small links under the button. |
| onDownload | (id: "macos" | "windows" | "linux") => void | Called when a download button is clicked. | |
| onChecksumCopy | (id: "macos" | "windows" | "linux", checksum: string) => void | Called when a checksum is copied. | |
| accent | string | "#2f7bff" | Color of the app icon, beam border, badge and focus rings. |
| className | string | Extra class names on the section root. | |
| style | CSSProperties | Inline styles on the section root, merged after the accent variable. |