iiinova — where your digital self keeps evolving

Travis Arnold @souporserious.com · 13/09/2026

volumetric clouds in wgsl 🌥️

Reposted by Travis Arnold

Josh W. Comeau @joshwcomeau.com · 27/04/2026

🎉 Registration is now open for my latest course, Whimsical Animations! This course will teach you everything you need to know to design and build stunning, creative animations and interactions. It’s time to make the web less generic and boring! 😄

whimsy.joshwcomeau.com

Whimsical Animations

Learn how to create charming interactions and delightful touches using the magic of CSS, JavaScript, SVG, and Canvas. I’m sharing all my tricks in this one!

313141

Travis Arnold @souporserious.com · 27/03/2026

new avatar just dropped, going back to my face since times are weird and I think we should all feel more connected 🫂

150

Travis Arnold @souporserious.com · 06/01/2026

Introducing @renoun/screenshot 📸 Capture any HTML element as an image with pixel-perfect accuracy, including modern CSS features.

220

Travis Arnold @souporserious.com · 01/01/2026

My talk is out! Keeping documentation in sync has always been hard, but now this is crucial to implement as LLMs produce more code that needs to be validated, and it's a lot easier than you think. gitnation.com/contents/com...

gitnation.com

Always Accurate Documentation by Travis Arnold

As a designer and engineer, I've faced challenges with outdated documentation causing friction and trust erosion. Documentation drift arises from scattered sources and lack of a single reference, lead...

010

Travis Arnold @souporserious.com · 01/12/2025

My talk is starting right now! Learn how to use React Server Components to always keep your documentation in sync 🔄

010

Travis Arnold @souporserious.com · 26/11/2025

Turning 35 today 🎉 so I’m shipping something a little early to celebrate. A premium Next.js + MDX slide deck template for renoun 50% off for a limited time: buy.polar.sh/polar_cl_tLG... - Record your talk in-browser (camera + slides) - Convert to MP4 - Keep everything local

preview of the renoun presentation template

020

Travis Arnold @souporserious.com · 16/10/2025

It's been almost five years since React Server Components were announced and three years since we could practically use them. I could not have built www.renoun.dev without React.

import { Directory } from 'renoun'

const posts = new Directory({
path: 'posts',
filter: '*.mdx',
})

export async function Page({ slug }: { slug: string }) {
const post = await posts.getFile(slug, 'mdx')
const Content = await post.getContent()
return <Content />
}

130

Travis Arnold @souporserious.com · 12/10/2025

Annotations for code blocks usually require writing regexes to target specific source code and don't stay in sync easily. Working on something new using inline JSX comments. Highly flexible, declarative, and exposes annotations as renderers you can do whatever you want with.

The following source text with "warn" highlighted in yellow and "error" highlighted in red: console.warn('Warning') console.error('Error')

import { CodeBlock } from 'renoun'

export function Annotations() {
return (
<CodeBlock
language="ts"
annotations={{
highlight: ({ children, color }) => (
<span
style={{
padding: '0 0.05em',
borderRadius: '0.25rem',
backgroundColor: color,
}}
>
{children}
</span>
),
}}
>
{`
console./* <highlight color='rgba(255,213,0,0.35)'> */warn/* </highlight> */('Warning')
console./* <highlight color='rgba(255,0,0,0.35)' /> */error('Error')
`}
</CodeBlock>
)
}

000

Travis Arnold @souporserious.com · 10/10/2025

renoun has taken a long time to build because I run into every single issue it's trying to solve for the documentation site. It feels good to finally talk about now though, I'm really happy with where the API is. The changelog is quite the history of where it has been so far 😄 renoun.dev/changelog

renoun.dev

renoun - The Documentation Toolkit for React

The renoun toolkit uses your React framework to keep documentation polished, in sync, and on brand.

041

Travis Arnold @souporserious.com · 08/10/2025

Excited to officially launch renoun.dev 🚀 This has been years in the making to deliver a focused set of components, hooks, and utilities in React for building great documentation exactly to your standards that always stay in sync.

renoun.dev

renoun - The Documentation Toolkit for React

The renoun toolkit uses your React framework to keep documentation polished, in sync, and on brand.

2203