Art Bits from HyperCard

2026-03-0621:439130archives.somnolescent.net

700+ crunchy graphics circa 1988 incoming

< Return to the junk pile

Long-time Macintosh users likely remember HyperCard, Apple's strange hypermedia system that was sorta like a cross between index cards, web pages, and 90s interactive edutainment software. HyperCard left a pretty big legacy for the Web to come, influencing everything from JavaScript to wikis to the pointing finger thing for links on pages to fuckin' Myst.

Apple packaged in some sample HyperCard stacks to get people up to speed with the software, including one called "Art Bits", which included a ton of sample clip art for use in your own stacks. This stack is fantastic for showing off just how much Apple could do with two colors.

The front of the Art Bits stack

Slowly, painfully, torturously, methodically—I've clipped out over 700 of these fucking things and stuck them on this page at their original size for your use and enjoyment. The entire thing is still less than 300kb, after all the PNGs are optimized, but regardless, I'm not responsible if it's really slow.

Back to top

Back to top

Back to top

Back to top

Back to top

Back to top

Back to top

Back to top

Back to top

Back to top

Back to top


Read the original article

Comments

  • By ascorbic 2026-03-0623:113 reply

    Ah, that'll be useful. The hardest thing about adding a new project to my site is finding a new HyperCard/System 6 icon. https://mk.gg/

    • By heliumtera 2026-03-0623:25

      Hey, I really loved the fonts on your website.

      For the past 10 years I've being using terminus bitmap font, so I have strong opinions about it. The only reason I prefer Firefox is because it supports bitmap.

      Reading your website on my phone made my day! Lovely fonts/aesthetics

    • By bensyverson 2026-03-0623:351 reply

      Wow, I must be in my 40s because I love your site :)

      • By ascorbic 2026-03-077:191 reply

        Did you find the "hot corner" though?

        • By bensyverson 2026-03-0717:15

          omg immediate nostalgia. I can still picture the After Dark floppies!

    • By zahlman 2026-03-070:251 reply

      I get that I'm critiquing you within your apparent wheelhouse, but this aesthetic also matters a lot to me.

        img[data-astro-cid-vnzlvqnm] {
          width: 48px;
          height: 48px;
          image-rendering: pixelated;
          object-fit: contain;
          margin-bottom: 0.5rem;
        }
      
      I understand the goal here, but it works really poorly IMO when the source images are generally 32x32 (and some of them are smaller to arbitrary degrees because the content has been cropped — this doesn't seem to distort aspect ratios, but e.g. the "eye" icon gets stretched to fill the space, and thus scales with a bespoke 48/25 factor). Meanwhile the hover cursor looks pixel-precise, but definitely too big compared to the icons. (It seems to have been scaled 2x ahead of time, from an authentic 16x16.) The background scale is also pixel-precise (I don't know whether it's 2x scaled just to scale it, or to look like a 2x2 "pattern") so the difference in approaches is just really jarring to me.

      (I think the font is also doing some anti-aliasing; probably can't really control that. It looks really cool, though.)

      I would really recommend not cropping to content, and either using integer-scale boxes or just accepting some sampling interpolation. Or just leaving everything at 1:1 scale. It'd be noticeably physically smaller than authentic for typical desktop displays, but that's just hardware doing what it does. (And as it stands, it might be bigger than authentic!) Bonus points for a `@media` query on device resolution to make the choice.

      (Edit: after reading through https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/P... I'm not really sure Firefox is working as advertised...? But I think x1.5 scaling for pixel art is always going to involve compromise.)

      • By ascorbic 2026-03-077:151 reply

        As I mentioned, images are the hardest to do because beyond the core icons, the available graphics vary massively in size. Displaying them at "actual size" makes them far too small to be usable on a modern screen. I think you're also probably misremembering the scale of the cursor. It's not perfect, but it's not meant to be 16x16. Take a look at https://hcsimulator.com/

        The approach I took is the best I could manage without hand-modifying every image. You're right that some of them are not as good as they should be. The ones that I did hand-make (the background, as you noticed, and the window chrome) are the ones that are pixel-perfect.

        The fonts took a lot of work to control the anti-aliasing. You'll see they vary quite a bit between monitors, OSs and browsers. Generally they look best in Firefox on a Mac retina display, because that's what I created them in.

        • By zahlman 2026-03-078:57

          > Displaying them at "actual size" makes them far too small to be usable on a modern screen

          Man, I have ancient (er, well, that's a bit awkward in context!) stuff, I know. But these things are still just fine at ~96dpi IMO.

          > I think you're also probably misremembering the scale of the cursor. It's not perfect, but it's not meant to be 16x16.

          I recall 16x16 cursors (System 6 CURS resource) and 32x32 icons, so I expect the cursor to be visually 1/2 the height/width of the icons. You have it effectively at 2/3.

          > on a Mac retina display

          These basically don't exist in my world. But again (or maybe I was unclear?), @media queries can check for dpi and not just viewport size.

  • By doawoo 2026-03-0622:277 reply

    We need a modern HyperCard, I want to see more creative computing

    • By oidar 2026-03-0622:461 reply

      Have you seen Decker: https://beyondloom.com/decker/

    • By simquat 2026-03-0623:21

      I'm working on it, Breadboard[0] is a visual app builder that mixes Figma-style UI design with Shortcuts-style logic.

      [0] https://breadboards.io/

    • By afandian 2026-03-0623:34

      I recently enjoyed this episode of Mac Folklore Radio.

      A surprising prescient discussion on HyperCard and hypertext.

      https://podcasts.apple.com/gb/podcast/mac-folklore-radio/id1...

    • By hyperhello 2026-03-071:581 reply

      There is this thing called the World Wide Web that does most of that.

      • By yjftsjthsd-h 2026-03-076:581 reply

        The web is sort of like hypercard, but it's not the same; in particular, the ease of creating things in hypercard is the important thing about it, and AFAIK that remains unmatched.

        • By NetMageSCW 2026-03-0719:341 reply

          Exactly - the Web is a PDF. Hypercard is a Word document.

          • By hyperhello 2026-03-0719:39

            As someone who knows rather a lot about HyperCard: it was never allowed or positioned to fulfill its potential. There were easily fixable security issues ruining the opportunity to be the center of OS scripting. The UI was never rewritten for color and to match the Mac UI, which would not have been complicated either. The code must have been very difficult to upgrade, either technically or organizationally, because the entire upgrade run past 2.0 was so meager. It was a piece of genius, but in the end, only a piece.

    • By tomcam 2026-03-078:381 reply

      LiveCode is its spiritual successor IMHO. Cross platform too. https://livecode.com/

      • By NetMageSCW 2026-03-0719:35

        Doesn’t really seem to get “it” to be a successor, or even a new VisualBasic.

    • By NetMageSCW 2026-03-0719:281 reply

      A long term goal of mine, but I would create a desktop application as I don’t think there’s enough focus on those any more.

      • By doawoo 2026-03-081:56

        I would love a local-first app, publish to web sure! but local first editor would be fantastic imo

    • By escapecharacter 2026-03-0623:06

      in progress ;)

HackerNews