Chat & Discussions>Discussions

How to make HTML components in Phoenix

/phoenix#tailwindcss
subhrashisdas

subhrashisdas

I am using tailwind css. Due to code duplicity, I want to use it as components. How to achieve that in clean way? I want to import the components and use it anywhere.

1 comment
/phoenix#tailwindcss
1517 1

Showing Posts 1 to 1

andreaseriksson

andreaseriksson

You can check how I did here:

I end up with something like:

<%= card do %>
    <%= card_header do %>
      The Coldest Sunset
  <% end %>
  <%= card_body do %>
      <p class="text-gray-700 text-base">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatibus quia,
      nulla! Maiores et perferendis eaque, exercitationem praesentium nihil.
    </p>
  <% end %>
<% end %>

But there is also partials and view helpers that you can write.

3
Post #1
— All posts loaded —

Where Next? Top

View thread on forum (has 1 reply!)
phoenix
tailwindcss
Home Chat & Discussions>Discussions
3 1365 1
Last post
REPLY VIEW THREAD

Trending in Discussions Top

cblavier
Chat & Discussions>Discussions

Phoenix Storybook: a storybook-like UI interface for Phoenix components
Hey there, It’s been more than a year since we started using LiveView as our main UI library and building a whole library of UI componen...
/phoenix#liveview#storybook
511 11537 94
New
mudasobwa
Chat & Discussions>Discussions

Cure - a new language compiled to BEAM
I am happy to introduce the very α version of the new programming language compiled to BEAM. Welcome Cure. It has literally three kille...
#static-types#type-checking#types#fsm
171 6315 70
New
mhanberg
Chat & Discussions>Discussions

Expert LSP is now available!
Hi everyone! The first release candidate for the Expert language server project is now available! We’ve published a press release detai...
#lsp#expert
220 4348 38
New
budgie
Chat & Discussions>Discussions

I genuinely hate programming now
A little off-topic, but I feel like people here have a good head on their shoulders. I used to be quite good at making software. Was luc...
#ai#career#rant
401 2903 96
New
achempion
Chat & Discussions>Discussions

Emacs like text editor in Elixir
I’ve been using Emacs as my main code editor for more than a two years. It’s a custom build version although I’ve tried doom emacs and sp...
#opensource#live-stream#twitch
24 2993 6
New
axelson
Chat & Discussions>Discussions

Remote Elixir Book Club (takes place on Discord)
Hi there! :wave: @frigidcode and I (but mostly him) have been running an Elixir Book club, we’re almost done with Designing Elixir Syste...
#meetups#book-club
43 3071 23
New
budgie
Chat & Discussions>Discussions

How does Elixir keep going?
I love Elixir. It’s one of 2 programming languages I’ve ever fallen in love with. But I don’t use it anymore. Serverless was the promis...
#language#serverless
109 1290 44
New

Other Trending Topics Top

GenericJam
News>Announcing

Mob - Native BEAM / Elixir on Native Mobile
Edit: 2026 May 15 - This post is archived. Mob is alive!! Main docs: mob v0.7.11 — Documentation A bit of explanation for the slightly c...
/mob#library#beam#mobile#liveview#react-native#mobile-app#mobile-development
259 8396 111
New
JesseHerrick
News>Announcing

Dexter - A fast, full-featured Elixir LSP optimized for large codebases
Hey, I’m Jesse and I’m the main contributor behind Dexter, a full-featured, lightning-fast Elixir LSP optimized for large codebases. It s...
#library#lsp#dexter
187 6988 64
New
garrison
News>Announcing

Hobbes - a low-level distributed database for the Elixir programming language
Hobbes is a low-level distributed database for the Elixir programming language. Hobbes provides a simple, safe, and scalable storage lay...
#library#database#distributed#hobbes
306 6242 88
New
mcass19
News>Announcing

ExRatatui - Elixir bindings for the Rust ratatui terminal UI library
ExRatatui lets you cook up rich terminal UIs in Elixir, powered by Rust’s ratatui via Rustler NIFs. Build interactive terminal applicatio...
#library#rust#terminal#tui
60 3370 16
New
georgeguimaraes
News>Announcing

Claude Code Elixir - Claude Code plugin marketplace for Elixir development
Just published claude-code-elixir, a plugin marketplace for Claude Code with Elixir support. These are the plugins I’ve been using for my...
#library#claude-code#marketplace
23 2253 9
New
Dmk
News>Announcing

Xamal - Deploy Elixir releases to bare metal servers via SSH
Xamal is a deployment tool for Elixir apps that deploys native releases to bare metal servers over SSH. It’s a port of GitHub - basecamp/...
#library#deployment#deploy#deployments#xamal
81 3021 34
New
Back to top

Latest Phoenix Threads

Phoenix Forum ❯

Chat & Discussions>Discussions

Chat Discussions ❯

Latest on Elixir Forum

Elixir Forum ❯

Sponsor Spotlight

Pragmatic Bookshelf

Practical resources that improve the lives of professional developers.

Our Sponsors

Dashbit

Build Elixir applications with speed and confidence.

EEF

Supporting innovation across the BEAM ecosystem.

Coders51

We build reliable cloud platforms for business-critical systems.

AppSignal

Catch errors, track performance, monitor hosts and more.

Code Sync

Elixir, Erlang & BEAM conferences from Code Sync - join us in 2026!

Pragmatic Bookshelf

Practical resources that improve the lives of professional developers.

Defacto

Bringing learning, work and compliance together since 1987.

ElixirCasts

Producing high quality Elixir screencasts since 2017.

Software Mansion

The team behind Membrane, Popcorn, LiveDebugger. Available for hire.

Pragmatic Studio

Courses that'll move you from confusion to "Aha, now I get it!"

View all our sponsors ❯

Categories:

Sub Categories:

Forums

Popular Tags

Our Sponsors

Dashbit

Build Elixir applications with speed and confidence.

EEF

Supporting innovation across the BEAM ecosystem.

Coders51

We build reliable cloud platforms for business-critical systems.

AppSignal

Catch errors, track performance, monitor hosts and more.

Code Sync

Elixir, Erlang & BEAM conferences from Code Sync - join us in 2026!

Pragmatic Bookshelf

Practical resources that improve the lives of professional developers.

Defacto

Bringing learning, work and compliance together since 1987.

ElixirCasts

Producing high quality Elixir screencasts since 2017.

Software Mansion

The team behind Membrane, Popcorn, LiveDebugger. Available for hire.

Pragmatic Studio

Courses that'll move you from confusion to "Aha, now I get it!"

View all our sponsors ❯

We're in Beta

About us Mission Statement

Options

Thread Display Mode




Thread Preview

Skip Thread Previews