Skip to content
Day 69: new resources are added every day. See what's new
Best Productivity ResourcesBy Shushant LakhyaniVerified creator

Framework

affectUI

Agent-ready React components, screens and blocks for AI products and SaaS.

Visit affectUI4.3

  • Rating

    4.3 / 5

  • Pricing

    Freemium

  • Difficulty

    Intermediate

  • Works on

    Web

Built with love by Shushant Lakhyani. Building bestproductivityresources.com

Free: 1,100+ ways people make money onlineFree: 399+ ways to make money online

What is affectUI?

affectUI is a library of React components, screens and blocks designed for AI products and SaaS apps. Each item is a single file with no dependencies, so you can add it yourself or let Claude, Cursor or v0 add it for you. Some items are free, and Pro is a one-time purchase.

Pros: what affectUI does well

  • Single-file components with no dependencies
  • Easy for AI tools to drop in
  • Pro is a one-time payment

Cons: where it falls short

  • Full library needs Pro
  • React only

Who affectUI is for

Developers building AI products who want ready-made chat and SaaS interface pieces.

Who can skip it

Projects not using React.

What people use affectUI for

  • Adding chat, prompt and other AI product screens to a React app
  • Building SaaS pages from ready-made components, screens and blocks
  • Letting Claude, Cursor or v0 add interface pieces for you through the MCP server
  • Using single-file components when you want no Tailwind or animation library

How to get started

  1. 1Browse the components, screens and blocks on affectui.com.
  2. 2Start with the free items, which are open source under the MIT licence.
  3. 3Add an item to your project with the shadcn CLI, or connect the MCP server so your AI coding tool adds it.
  4. 4Buy affectUI Pro only if you need the rest of the library.

affectUI pricing

There is a free set of items under the MIT licence. The rest of the library is affectUI Pro, a one-time purchase rather than a subscription. See current prices on affectUI's site

Checked 2026-11-07. Prices change, so double-check before you pay.

affectUI FAQ: quick answers

Is affectUI free?
Partly. A set of items is free and open source under the MIT licence; the rest needs affectUI Pro, which is a one-time purchase.
Does affectUI need Tailwind?
No. Each item is one .tsx file with its styles included, with no Tailwind, animation library or other dependencies.

affectUI alternatives

Not sold on affectUI? These do a similar job, and each card says what it has in common.

All Workflows resources

Halaska UI

Focus: ui kit, shadcn and design system. Shares react and ai products with affectUI. A template, not a framework. Free (affectUI: Freemium). Same 4.3 rating.

TemplateFreeWeb
4.3Visit

OpenUI

Focus: generative ui, framework and open source. Shares react with affectUI. Free (affectUI: Freemium). Rated 4.7 (affectUI: 4.3).

FrameworkFreeWeb, Cross-Platform
4.7Visit

Astryx Design System

Focus: design system, stylex and open source. Shares react with affectUI. Free (affectUI: Freemium). Rated 4.6 (affectUI: 4.3).

FrameworkFreeWeb
4.6Visit

shadcn/ui

Focus: tailwind, open source and design system. Shares ui components and react with affectUI. Free (affectUI: Freemium). Rated 4.9 (affectUI: 4.3).

FrameworkFreeWeb
4.9Visit

Annnimate

Focus: gsap, animation library and react components. Shares ui components with affectUI. A website, not a framework. Rated 4.8 (affectUI: 4.3).

WebsiteFree planWeb
4.8Visit

Libraries.dev

Focus: ui effects, npm and animation. Shares react with affectUI. A website, not a framework. Rated 4.8 (affectUI: 4.3).

WebsiteFree planWeb
4.8Visit

Free alternatives to affectUI

Want to spend nothing? These free picks cover similar ground.

React Bits

Focus: animations, effects and open source. Shares ui components and react with affectUI. Free (affectUI: Freemium). Rated 4.7 (affectUI: 4.3).

FrameworkFreeWeb
4.7Visit

23rd

Focus: shadcn registry, react components and svelte 5. Shares ui components with affectUI. A website, not a framework. Free (affectUI: Freemium). Rated 4.6 (affectUI: 4.3).

WebsiteFreeWeb
4.6Visit

Kokonut UI

Focus: tailwind, nextjs and motion. Shares ui components and react with affectUI. Free (affectUI: Freemium). Rated 4.6 (affectUI: 4.3).

FrameworkFreeWeb
4.6Visit

Great UI

Focus: tailwind, framer motion and typescript. Shares ui components and react with affectUI. Free (affectUI: Freemium). Rated 4.4 (affectUI: 4.3).

FrameworkFreeWeb
4.4Visit

Kumo

Focus: design system and cloudflare. Shares react and ui components with affectUI. Free (affectUI: Freemium). Rated 4.4 (affectUI: 4.3).

FrameworkFreeWeb
4.4Visit
Are you the maker of affectUI?Get a free Featured badge for your site, a share image and ready-to-paste posts. No sign-up.

New · updated daily

What people are actually doing with AI

Real use cases shared on Reddit, Hacker News, X, GitHub and blogs, summarised in plain words with a link to every original post.

Browse AI use cases

Free Notion database

1,100+ ways people are making money online

Real online businesses, creators and projects, broken down by how they make money: apps, online stores, AI tools and more. Free on Gumroad.

Get the free database

Free Notion database

399+ ways to make money online

Hundreds of online income methods in one place, so you can compare options and pick one to try. Free on Gumroad.

Get the free list

For research and ideas only. Results vary and nothing here is a promise of income. See our Disclaimer.

Weekly newsletter

Everything new, every Monday.

One short email every Monday with everything shipped that week: new free tools and websites, new guides, new free browser tools and what's new in my free Gumroad libraries, plus how the site is growing. Free, and you can unsubscribe anytime.

Join the newsletter

You sign up on Gumroad, which stores your email to send the newsletter. See our Privacy Policy.