Ariakit
@ariakit.org
📤 388
📥 3
📝 2
Toolkit with accessible components, styles, and examples for your next web app
https://ariakit.org
pinned post!
Building something with
@ariakit.org
? Share it here on 🦋 Bluesky mentioning us and we will repost.
11 months ago
0
8
2
reposted by
Ariakit
Haz
about 3 hours ago
Collapsible sidebar built with
@ariakit.org
loading . . .
0
4
2
reposted by
Ariakit
Haz
4 days ago
1, 2, or 3?
7
2
1
reposted by
Ariakit
Haz
6 days ago
Sidebar with animated, collapsible groups styled with @ariakit/tailwind Automatic light/dark modes.
loading . . .
1
7
1
reposted by
Ariakit
Haz
6 days ago
Checkbox cards built with
@ariakit.org
0
10
1
reposted by
Ariakit
Haz
7 days ago
Code examples with embedded API docs
loading . . .
0
9
1
reposted by
Ariakit
Haz
8 days ago
Built with
@ariakit.org
loading . . .
1
10
1
reposted by
Ariakit
Haz
9 days ago
Preview/code blocks
loading . . .
0
8
1
reposted by
Ariakit
Haz
10 days ago
Segmented control built with @ariakit/tailwind
loading . . .
1
11
2
reposted by
Ariakit
Haz
15 days ago
Collapsible payment method card styled with Ariakit Tailwind.
1
8
1
reposted by
Ariakit
Haz
18 days ago
Nested animated collapsible panels built with Ariakit
loading . . .
0
10
1
reposted by
Ariakit
Haz
20 days ago
Built with @ariakit/tailwind Automatic dark/light modes and contrast.
loading . . .
2
18
1
reposted by
Ariakit
Aurora Scharff
about 1 month ago
My talk at WeAreDevs World Congress on building interactive, asynchronous UI with React 19 and
@ariakit.org
is now available! Watch it here:
www.wearedevelopers.com/en/videos/15...
loading . . .
Aurora Scharff - Building Interactive Async UI with React 19 and Ariakit
This was on 10/07/2025 on Stage 5 Handling async operations in UI components can be tricky—pending states, inefficient updates, and accessibility challenges often arise. This session will explore how ...
https://www.wearedevelopers.com/en/videos/1589/building-interactive-async-ui-with-react-19-and-ariakit
1
7
3
reposted by
Ariakit
Haz
about 1 month ago
Built with
@ariakit.org
Tailwind
loading . . .
1
14
1
reposted by
Ariakit
Haz
about 1 month ago
Built an example using React Aria and Ariakit Styles 🤝🏽 Coming soon to the Ariakit site.
loading . . .
0
2
1
reposted by
Ariakit
Haz
about 1 month ago
The next version of the Ariakit site will include native HTML examples with Tailwind styles. Super excited about this.
0
22
3
reposted by
Ariakit
Haz
about 2 months ago
Ariakit Disclosure component animated with pure CSS.
loading . . .
0
9
1
reposted by
Ariakit
Haz
about 2 months ago
Collapsible list items built with native HTML (ol > li > details > summary) and Ariakit Tailwind.
loading . . .
1
23
4
reposted by
Ariakit
Haz
about 2 months ago
We're working on an improved version of
@ariakit.org
, and I've never seen anything this good. – Superb UX – 200+ new copy/paste examples – Tailwind plugin for easy and accessible styling – shadcn commands Can't wait to release this.
loading . . .
1
34
5
reposted by
Ariakit
Haz
2 months ago
Working on custom styles for checkbox cards
0
20
2
reposted by
Ariakit
Haz
2 months ago
Ariakit has a banner (finally)
1
18
2
reposted by
Ariakit
Aurora Scharff
3 months ago
Successful talk at
@wearedevelopers.bsky.social
this week. It was great to demo to more developers what
@ariakit.org
can do 🔥
add a skeleton here at some point
0
9
2
reposted by
Ariakit
Dani Guardiola
3 months ago
always bet on ariakit
add a skeleton here at some point
0
5
1
reposted by
Ariakit
Haz
3 months ago
This is why I believe Ariakit dot org will stay relevant for decades: – It's always been about examples. And we'll feature multiple libraries: Ariakit React, Radix, Base UI, RAC, Headless UI, and others outside the React ecosystem.
1
14
5
reposted by
Ariakit
React Advanced London
4 months ago
🎤 Learn about building async-ready UIs the React 19 way.
@aurorascharff.no
shows how React Server Components, new mutation tools, and Ariakit combine to create accessible, streamlined, low-boilerplate UIs. 🗓️ Nov 28 & Dec 1,
#ReactAdvanced
loading . . .
Learn more!
reactadvanced.com
https://reactadvanced.com?utm_source=twitter&utm_medium=speaker
0
3
2
reposted by
Ariakit
Haz
4 months ago
It works really well.
0
4
1
reposted by
Ariakit
Haz
4 months ago
You might want to take a look at the Composite primitive in Ariakit. It's specifically designed to be a low-level primitive to create any sort of composite widget, like listboxes and grids.
ariakit.org/components/c...
0
6
1
reposted by
Ariakit
Dani Guardiola
5 months ago
in
@ariakit.org
the plan is to transition to native browser APIs as they become more stable and available, with polyfilling options and such. it's very cool because it means Ariakit is meant to shrink overtime in size.
1
4
1
reposted by
Ariakit
Haz
6 months ago
I want to offer Popover components in Ariakit that don't rely on Floating UI, allowing users to customize them with CSS anchor positioning (using a polyfill for browsers that lack support).
3
6
2
reposted by
Ariakit
Haz
6 months ago
Working on new Combobox examples for Ariakit 🧑🏽💻
1
12
2
reposted by
Ariakit
Aurora Scharff
6 months ago
It's another beautiful day with useOptimistic() and use(), featuring
@ariakit.org
, which I tried for the first time and instantly fell in love with ☺️ Maybe this example needs a blog post?
2
21
3
reposted by
Ariakit
Haz
6 months ago
I'm working on a shadcn registry for the upcoming version of
Ariakit.org
I'm still not sure if it will support everything I need, but it looks promising.
0
15
3
reposted by
Ariakit
Haz
7 months ago
I just realized that Ariakit Styles is fantastic for code highlighting. You can use any background you want, and it ensures that the text colors maintain enough contrast. Just CSS.
loading . . .
1
38
3
In case you missed it, Ariakit now has a new Discord channel. We're discussing Ariakit Solid and Ariakit Styles there. Join us at
chat.ariakit.org
loading . . .
Join the Ariakit Discord Server!
The official Ariakit community on Discord. | 35 members
https://chat.ariakit.org
7 months ago
0
5
2
reposted by
Ariakit
Haz
7 months ago
If you're interested in trying Ariakit Styles, just DM me or join our Discord:
discord.gg/WyHvnXsvMs
add a skeleton here at some point
0
4
2
reposted by
Ariakit
Dani Guardiola
7 months ago
there's a new kid on the block... introducing the brand new... 🚀 Ariakit official Discord server! ➡️ join now:
discord.gg/WyHvnXsvMs
⬅️
loading . . .
0
10
4
reposted by
Ariakit
Haz
7 months ago
Ariakit React has reached 1 million downloads a month 🥳
1
38
4
reposted by
Ariakit
Haz
7 months ago
Ariakit Styles will automatically adjust selection backgrounds and text colors to ensure sufficient contrast with surrounding elements. Usage with Tailwind CSS: <body class="selection:ak-layer-contrast-primary"> → "primary" can be any token from your theme. In this case, it's a mid-tone blue.
loading . . .
4
26
3
reposted by
Ariakit
Haz
7 months ago
Welcome
@dio.la
to the Ariakit core team 🥳
0
13
3
reposted by
Ariakit
Dani Guardiola
8 months ago
Ariakit Solid 0.2 is coming soon, with tons of improvements and 4-5 new primitives including Focusable, Command, Button and Checkbox (maybe Portal too). still quite early but the progress is real, stay tuned!
0
6
2
reposted by
Ariakit
Dani Guardiola
7 months ago
coding stream tomorrow (open source / Ariakit Solid) 5:30pm CET (4:30pm UTC) ->
twitch.tv/daniguardio_la
<-
loading . . .
daniguardio_la - Twitch
i almost never stream lol - software ⋅ open source ⋅ web ⋅ typescript ⋅ solidjs ⋅ react ⋅ rust ⋅ accessibility ⋅ ui
https://twitch.tv/daniguardio_la
0
4
2
reposted by
Ariakit
Dani Guardiola
8 months ago
i'm live on twitch! open sourcing! my first stream ever - working on the official
@solidjs.com
port of
@ariakit.org
come say hi! :) ->
www.twitch.tv/daniguardio_la
<-
loading . . .
daniguardio_la - Twitch
i almost never stream lol - software ⋅ open source ⋅ web ⋅ typescript ⋅ solidjs ⋅ react ⋅ rust ⋅ accessibility ⋅ ui
https://www.twitch.tv/daniguardio_la
1
7
1
reposted by
Ariakit
Haz
8 months ago
Exploring automatic rounded corners in Ariakit Styles. Nested elements inherit their parent's border radius when they're close to the edges. Once detached, they can apply their own border radius. This solution relies solely on CSS. What do you think?
loading . . .
6
34
2
reposted by
Ariakit
Haz
8 months ago
For reference, here's what Ariakit Styles would have done to this UI. I chose the same colors, same blue. Ariakit adjusts it to maintain contrast no matter which background is selected (which you could let users customize it to their preference).
1
1
1
reposted by
Ariakit
Haz
8 months ago
Here's an example of ak-layer > ak-text. All texts in the same column use the same color (for example, all "yellow" elements use ak-text-[yellow]). Ariakit automatically adjusts the color to ensure a minimum contrast ratio of 4.5:1 with the layer background. No JS. Just CSS and color theory.
1
16
4
reposted by
Ariakit
Haz
8 months ago
I wrote about Ariakit Themes:
gist.github.com/diegohaz/aef...
Let me know your thoughts.
loading . . .
Ariakit Themes
Ariakit Themes. GitHub Gist: instantly share code, notes, and snippets.
https://gist.github.com/diegohaz/aef9925b1595d83f7e7f0f9e4a9f03ac
2
15
3
reposted by
Ariakit
Pipo
9 months ago
PRISMA Capacity had another round of open source sponsoring ❤️:
www.prisma-capacity.eu/news/insight...
This time we made donations to
@ariakit.org
,
@colinhacks.com
's zod,
@typescript-eslint.io
,
floating-ui.com
and
www.haecksen.org
. Thank you all for your work.
loading . . .
Backing Open-Source Innovation: The POSS Fund 2024 | PRISMA
PRISMA continues its support for the open-source community with the POSS Fund 2024.
https://www.prisma-capacity.eu/news/insights/backing-open-source-innovation-poss-fund-2024
1
8
4
reposted by
Ariakit
Jan Toman
9 months ago
A nice new example from @ariakitjs: Command Menu with Tabs ❤️ It has it all — tabs, multi-column layout (grid), full keyboard navigation, solid API.
ariakit.org/examples/di...
loading . . .
1
9
2
reposted by
Ariakit
Haz
9 months ago
✨ New example: Command Menu with Tabs A command palette built with Dialog, Combobox, and Tab components from Ariakit. Demo:
ariakit.org/examples/dia...
1
22
4
reposted by
Ariakit
Ben Rodri
9 months ago
Trying to explain
@ariakit.org
's `focusShift` option 🤔
0
3
1
reposted by
Ariakit
Dani Guardiola
9 months ago
I'm porting
@ariakit.org
to
@solidjs.com
. Here's how you can help:
github.com/ariakit/aria...
loading . . .
Ariakit Solid: how to help and general discussion · ariakit ariakit · Discussion #4322
Hi folks! I'm working on an Ariakit port to Solid (tracked in #4117). My goal with this post is to share some important insights so that they can be shared and discussed. We might also need some he...
https://github.com/ariakit/ariakit/discussions/4322
0
25
6
Load more
feeds!
log in
