Skip to content

Noir Aurora

Avatar

Photo or initials in a circle; the initials sit on a night tint picked from the name, lit from the top left with a ring in that tint's sky colour, and behind the photo so a broken image still reads.

Live, interactive React component · dark themeResponsive

About the Noir Aurora Avatar

Photo or initials in a circle; the initials sit on a night tint picked from the name, lit from the top left with a ring in that tint's sky colour, and behind the photo so a broken image still reads. AvatarGroup overlaps avatars and ends with "+N".

It is part of Noir Aurora. The style’s 91 pieces share one set of tokens, type and motion, in a light and a dark theme, so whatever you take from it fits together.

To put it in your project, copy the prompt into Claude Code, OpenAI Codex or Cursor, or add the file and its styles by hand. The documentation walks through both.

The same piece, drawn for a different look. Open one to compare it live.

Neo-Brutal Avatar

Photo or initials in an ink-outlined circle; the initials (display face, bold) sit on a volt, lilac, tomato or cobalt-100 tint picked from the name, behind the photo, so a broken image still reads.

Soft Bento Avatar

Photo or initials in a clay circle; the initials' candy tint is picked from the name, and they sit behind the photo so a broken image still reads.

Swiss Tech Mono Avatar

Photo or initials on a square tile; the initials' look (ink, haze or outline, never lime: lime means selected) is picked from the name, or set with the kit look prop, and they sit behind the photo so a broken image still reads.