v0.1.5 — Latest

Senren
UI.

A production-grade component library for Rails apps. Source-copied, Hotwire-native, and built so AI agents can read and extend it without breaking your design system.

Get started Browse components

bundle add senren-ui

Terminal

bin/rails generate senren:install
bin/rails senren:add button card dialog form
bin/rails senren:agents:sync

app/views/dashboard/index.html.erb

<%= render Senren::CardComponent.new do |card| %>
  <% card.with_header do %>
    <%= render(Senren::TypographyComponent.new(variant: :h3)) { "Welcome back" } %>
  <% end %>
  <% card.with_body do %>
    <p class="text-sm">Your Senren UI starts here.</p>
  <% end %>
  <% card.with_footer do %>
    <%= render(Senren::ButtonComponent.new(variant: :primary)) { "Continue" } %>
  <% end %>
<% end %>

Why Senren

Built for the way Rails actually ships.

ViewComponent native

Every primitive is a ViewComponent. Variants, slots, content. No DSL to learn beyond Rails.

Hotwire & Turbo

Server-rendered first. Stimulus only for local UI behavior. No SPA, no global state framework.

Source-copy architecture

Components are copied into your app. You own the source, not a black box.

AI-agent ready

Centralized .senren/skill.md and multi-agent instruction sync for Codex, Claude, Copilot, and Cursor.

TailwindCSS tokens

Semantic design tokens (background, foreground, primary, muted) drive every component. Theming is one CSS file.

Production-ready

Sixty-two components across eight categories. Ship with confidence.

Showcase

A few of the primitives.

Sixty-two components, eight categories. Every one is yours after install — readable, editable, owned.

Button

Six variants, three sizes, icon-friendly.

Badge

Status, priority, count.

Default Success Warning Destructive Outline

Card

Header, body, footer slots.

Pro plan

Everything in Hobby, plus advanced analytics.

$24 / month

Form primitives

Label, Input, Textarea, NativeSelect.

Role

Alert

Info, success, warning, destructive.

Heads up

Servers will restart at 02:00 UTC for maintenance.

Avatar & Skeleton

Identity & loading states.

AS MK RJ

Browse all 62 components

AI agents

Designed to be read by machines.

Every install creates .senren/skill.md, a centralized component map grouped by Actions, Forms, Overlays, Navigation, Layout, Data Display, SaaS Blocks, and Rich Content. Every component declares its purpose, dependencies, accessibility rules, AI agent rules, and anti-patterns.

This site serves llms.txt and llms-full.txt for discovery. Inside your app, .senren/agent-rules.md and adapter files for Codex, Claude, Copilot, and Cursor keep every AI agent in sync automatically.

Read the AI guide

.senren/skill.md

## Component: Dialog

Category: Overlay

Depends on:
  - Button
  - senren--dialog Stimulus controller

Pairs with:
  - FormField
  - Button
  - AlertDialog

Use for:
  - confirmation modal
  - short create/edit form modal

Avoid:
  - long multi-step workflows
  - full-page replacement

Agent rules:
  - Always include a visible title.
  - Preserve Escape key close behavior.
  - Preserve focus management.
  - Use Stimulus only for open/close/focus.
  - Do not introduce React, Vue, Alpine, or
    external modal libraries.

Ship a polished SaaS UI
without leaving Rails.

Install Senren Browse components

Senren UI.