Components, Guides, and Paradigms for CRAZY-fast Development in Ruby on Rails!

😃 Get Started

bundle add loco_motion-rails

scroll — watch the components leave the station ↓

Large Badge

= daisy_button "Accent Button", css: "btn-accent"
= daisy_tip("Click to Swap") do
  = daisy_swap off: "🌚", on: "🌞"
= daisy_badge "Large Badge", css: "badge-secondary badge-lg"

70+

Ready-made components

Guides & paradigms

∞

Themeable

100%

Ruby on Rails

💎

so much cleaner

SIMPLE, CONCISE VIEWS

No more messy ERB.

Utilize HAML so your views are simple, concise, and easy to understand. HAML feels more natural to write and reduces file sizes, making your views easier to read and maintain.

PLUS! You can utilize filters like Markdown , CoffeeScript, Textile, and many more!

Read the HAML guide

ERB · 12 LINES 😵

<% 5.times do |i| %>
  <% if i.even? %>
    <p class="odd">
      Number <%= i %>
    </p>
  <% else %>
    <p class="even">
      Numero <%= i %>
    </p>
  <% end %>
<% end %>

HAML · 5 LINES ✨

- 5.times do |i|
  - if i.even?
    %p.odd Number #{i}
  - else
    %p.even Numero #{i}

define_parts :head, :body, :legs

POWERFUL DSL

Build your OWN components.

Can't find exactly what you need? No problem! Build your own components with ease using our simple, flexible, and powerful DSL — parts, tags, CSS, and Stimulus controllers, all in one place.

Read the components guide

# app/components/character_component.rb
class CharacterComponent < ApplicationComponent
  define_parts :head, :body, :legs

  def before_render
    set_tag_name(:head, :h1)
    add_css(:head, "text-3xl font-bold")
    add_stimulus_controller(:body, "character-body")
  end
end

✅ New guide published!