Senren UI
v1.2 — Stable

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.

bundle add senren-ui
Terminal
bin/rails generate senren:install
bin/rails senren:add button card dialog form
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, llms.txt, llms-full.txt. AI agents read your design system, not guess.

TailwindCSS tokens

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

Production-grade v1.2

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.

Alert

Info, success, warning, destructive.

Heads up
Servers will restart at 02:00 UTC for maintenance.

Avatar & Skeleton

Identity & loading states.

AS MK RJ

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.

Plus public/llms.txt and public/llms-full.txt — an emerging standard for letting agents discover your local design system.

.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.