# taste — design inspiration and aesthetic references > 13 entries on [tetraslam.world/taste](https://tetraslam.world/taste) ### dot matrix a collection of dot matrix loader animations > **Design notes:** read the usage page for details on how to use this library. it's compatible with shadcn/ui. - ![screenshot 1](https://valuable-mandrill-918.convex.cloud/api/storage/8ffb3189-03f2-4d0e-9430-7b92d229ef71) - **Tags**: animations, library - **URL**: https://dotmatrix.zzzzshawn.cloud/ --- ### Oxide Computer Company > **Design notes:** - physical server aesthetics - button textures, green cell grids - technical, clear design style without slop monospace wannabe hacker aesthetics - information hierarchy, text and graphic readability - ![screenshot 1](https://valuable-mandrill-918.convex.cloud/api/storage/a9c32546-ca35-4aee-94f4-2aa9f6c50738) - ![screenshot 2](https://valuable-mandrill-918.convex.cloud/api/storage/4d97bf4f-b981-4dd4-9447-08c1d8077fe0) - **Tags**: antislop software, aesthetic, animations, shapes - **URL**: https://oxide.computer/ --- ### Palladium Magazine: Governance Futurism > **Design notes:** - content of this kind is held in high regard - hopium and grandiosity and restraint all at once - ![screenshot 1](https://valuable-mandrill-918.convex.cloud/api/storage/0c33c047-9858-46cc-ad4f-63572cb0f368) - **Tags**: aesthetic - **URL**: https://www.palladiummag.com/ --- ### torph - dependency free text morphing > **Design notes:** - the right way to morph text in interfaces - use for UI work which would benefit from this - ![screenshot 1](https://valuable-mandrill-918.convex.cloud/api/storage/08f9898d-75dd-4ae2-9a0e-405cc921c835) - **Tags**: aesthetic, animations, library - **URL**: https://torph.lochie.me/ --- ### Osmosis AI Osmosis' landing page > **Design notes:** - atmospheric styling (relevant to the product, a self-serve + forward deployed platform for RL on open source models, i.e., hill-climbing) - grain/papery texture over graphics - subtly animated fog - smooth abstract graphics animated on scroll (manifolds, text highlight morphing) - ![screenshot 1](https://valuable-mandrill-918.convex.cloud/api/storage/7bbb790d-f244-475f-a5e4-2a33e77cb94b) - ![screenshot 2](https://valuable-mandrill-918.convex.cloud/api/storage/816ad31d-42f7-4a7a-a9eb-28d9d853fb0e) - **Tags**: aesthetic, animations, shapes - **URL**: https://osmosis.ai/ --- ### diffs pierre computer's open-source diff and code rendering library > **Design notes:** - note extensibility and structural design taste - devtools need to be designed like devtools, and products like products, and in some cases both - ![screenshot 1](https://valuable-mandrill-918.convex.cloud/api/storage/1debc8f1-47e5-4839-bea9-ab8ff5a4eb89) - **Tags**: antislop software, library - **URL**: https://diffs.com/ --- ### camelot.wiki vie mccoy's writings/blog/notes > **Design notes:** - this site is included for its high-entropy content and mystique - vie mccoy is a red-teaming ai safety researcher at openai - this website and all its subpages (note: the main page alone is not sufficient to gain a concrete understanding of the content that caused it to make this taste list) are worth reading - ![screenshot 1](https://valuable-mandrill-918.convex.cloud/api/storage/fd52957d-1aff-4f0d-8050-f8b9f901c78b) - **Tags**: aesthetic, writing - **URL**: https://camelot.wiki/citadel/camelot.wiki/about/something+about+the+stars --- ### pi coding agent Pi is a minimal terminal coding harness. Adapt pi to your workflows, not the other way around. Extend it with TypeScript extensions, skills, prompt templates, and themes. Bundle them as pi packages and share via npm or git. Pi ships with powerful defaults but skips features like sub-agents and plan mode. Ask pi to build what you want, or install a package that does it your way. Four modes: interactive, print/JSON, RPC, and SDK. See clawdbot for a real-world integration. > **Design notes:** - example of a great coding agent TUI - also a great example of extensible software purpose-built and well-thought-out for its contextual purpose (a coding agent with extensions that hot-reload, meaning that it can improve itself iteratively) - the tree system for chats is highly intuitive in comparison to linear chat histories which don't accurately represent coding agents with subtasks and subagents - sane defaults and extensibility for the rest - ![screenshot 1](https://valuable-mandrill-918.convex.cloud/api/storage/0df57e51-282a-4adb-904b-1a070e3e68bc) - **Tags**: antislop software, tui - **URL**: https://pi.dev/ --- ### security questionnaire a website with incredible animations that i (tetraslam) built using shaders.paper.design > **Design notes:** notice: - the background grain - the typography - and ESPECIALLY the animation on the file upload area (not a static gradient, it's a live @paper-design/shaders-react Dithering component with shape="warp". Color shifts from #0f1a24 (dormant deep blue) to #1a4a3a (active forest green) on drag/hover, and the speed ramps from 0.2 to 0.6. The shader breathes.) - github repo available here: github.com/tetraslam/delve-onsite - ![screenshot 1](https://valuable-mandrill-918.convex.cloud/api/storage/dc9cd280-d0a2-4a34-81dd-198cf71eb718) - ![screenshot 2](https://valuable-mandrill-918.convex.cloud/api/storage/5a6ea7d3-c136-40be-b8b3-0e9e1138510b) - **Tags**: animations, aesthetic, shaders - **URL**: https://delve-onsite.vercel.app --- ### tnkr.ai - where the world builds robots highly aesthetically pleasing website > **Design notes:** things to take note of - ionian pillar - blue sky, atmospheric, open feel - fast-loading, clean, smooth screen recording gif of using the platform, with a preloaded project with many visuals of robot schematics, many animations of the robot moving - incredible aesthetic robot hand generated using (presumably) nano banana + veo 3 (from the frame), highly aesthetic robot arm and movement - greek aesthetics, images and aesthetic representing trust, foundational work, futurism (greco-futurism is in vogue right now) - ![screenshot 1](https://valuable-mandrill-918.convex.cloud/api/storage/507c3c78-874a-4d76-8ac5-df3f536a6aad) - ![screenshot 2](https://valuable-mandrill-918.convex.cloud/api/storage/0d242b03-2853-49a0-a565-70f4da89a4bd) - **Tags**: aesthetic - **URL**: https://www.tnkr.ai/ --- ### dither pluginn simple dither plugin for tailwindcss > **Design notes:** this supports a lot of cases and is hackable. use for - dithering an image - whether it's monochromatic or colored - dithering can be more distinct with a gradient-like effect - dither over animations/gifs - ![screenshot 1](https://valuable-mandrill-918.convex.cloud/api/storage/4d24df52-d5e4-45c5-a385-ab1387ba1ef2) - **Tags**: library - **URL**: https://dither.floriankiem.com/ --- ### conway by rankdim lightweight library for making conway's game of life animations for websites. used on this website! > **Design notes:** - aesthetic patterns require structure, decent speed, consistent temporal novelty, and even distribution between clusters - colors used matter a lot (reconciling contrast and the color palette is important) - ![screenshot 1](https://valuable-mandrill-918.convex.cloud/api/storage/7251d508-7ba8-4467-afba-649f1db5c8b6) - **Tags**: library, animations - **URL**: https://rankdim.github.io/conway/ --- ### shaders.paper.design cool shaders and a library to use them > **Design notes:** cool shaders and a library to use them. - effects are best used *on top* of visual regions with *no* foreground text/etc since that minimizes clashing and maximizes the cool effect - dither on animated components/gifs looks incredible - ![screenshot 1](https://valuable-mandrill-918.convex.cloud/api/storage/3a90715f-0b00-4154-9dfc-76c9f55e292e) - **Tags**: shaders, library, animations - **URL**: https://shaders.paper.design ---