# Show GN: tui.builders – 터미널 UI의 Figma, Rust 코드 생성까지

> Clean Markdown view of GeekNews topic #27581. Use the original source for factual precision when an external source URL is present.

## Metadata

- GeekNews HTML: [https://news.hada.io/topic?id=27581](https://news.hada.io/topic?id=27581)
- GeekNews Markdown: [https://news.hada.io/topic/27581.md](https://news.hada.io/topic/27581.md)
- Type: show
- Author: [subinium](https://news.hada.io/@subinium)
- Published: 2026-03-17T11:57:47+09:00
- Updated: 2026-03-17T11:57:47+09:00
- Original source: [tui.builders](https://tui.builders/)
- Points: 14
- Comments: 2

## Summary

**tui.builders**는 브라우저에서 터미널 UI를 시각적으로 설계하고, 이를 **Rust 코드로 즉시 변환**해주는 에디터입니다. 드래그 앤 드롭으로 위젯을 배치하면 `.w(30).p(2).border(...)` 형태의 체이닝 코드가 자동 생성되어, 레이아웃 작성 부담을 크게 줄입니다. 함께 공개된 **SuperLightTUI**는 CSS flexbox와 Tailwind 유틸리티 문법을 차용한 Rust TUI 라이브러리로, 단 세 줄의 코드로 앱을 렌더링할 수 있을 만큼 단순한 구조를 지향합니다.

## Topic Body

Rust의 성능과 단일 바이너리 배포 같은 장점 때문에 CLI/TUI 도구를 Rust로 만드시는 분들이 꽤 계실 거라 생각합니다.  
  
Python의 Textual이나 JS의 Ink 같은 도구들은 문법이 비교적 편하지만, 런타임 의존성이나 성능 오버헤드가 신경 쓰이는 경우도 있고요. Rust 쪽에서는 ratatui가 좋은 생태계를 갖추고 있지만, 레이아웃 잡는 데 드는 시간이 적지 않습니다.  
  
그래서 두 가지를 만들었습니다.  
  
##### 1. tui.builders — 터미널 UI를 브라우저에서   
시각적으로 디자인하고 Rust 코드를 내보내는 에디터입니다.  
https://tui.builders  
  
위젯을 드래그하고 인스펙터에서 속성을 설정하면  
코드가 1:1로 생성됩니다:  
  - 인스펙터: width=30, padding=2, border=rounded  
  - 코드:    .w(30).p(2).border(Border::Rounded)  
  
##### 2. SuperLightTUI — 이 1:1 매핑을 위해 설계한  
Rust TUI 라이브러리입니다.   
  
CSS flexbox + Tailwind   
유틸리티 클래스 방식이라, 웹 개발 경험이 있으면  
별도 학습 없이 레이아웃을 잡을 수 있습니다.  
  ```  
slt::run(|ui| {  
      ui.bordered(Border::Rounded).p(2).gap(1).col(|ui| {  
          ui.text("hello").bold().fg(Color::Cyan);  
          if ui.button("click").clicked { count += 1; }  
      });  
  });  
```  
  
클로저 하나가 앱 전체입니다. App 구조체, 이벤트 루프,  
trait 구현 없이 3줄이면 렌더링됩니다.  
- 의존성 2개 (crossterm + unicode-width), unsafe 0  
- immediate-mode 렌더링, ~1ms 프레임  
- 50+ 위젯 (차트, 테이블, 이미지, AI 위젯 등)  
- 에디터 없이 라이브러리만으로도 사용 가능  
  
Rust TUI의 성능은 유지하면서 개발 속도도 챙기고 싶은  
분들에게 도움이 되면 좋겠습니다.  
  
- tui.builders: https://tui.builders  
- GitHub: https://github.com/subinium/SuperLightTUI  
- crates.io: cargo add superlighttui

## Comments



### Comment 53497

- Author: @deleted_gndfr0dev
- Created: 2026-03-21T12:45:40+09:00
- Points: 1

Ratatui 쓰다가 귀찮아서 그냥 안썼는데, 딱 단점을 잡았네요! 정말 좋습니다 ㅋㅋ

### Comment 53245

- Author: kayws426
- Created: 2026-03-17T19:51:51+09:00
- Points: 1

와우! 좋네요!!