메인 콘텐츠로 건너뛰기

플러그인

CSS 전용 Tailwind CSS 플러그인으로 Frutjam을 확장하세요. 제로 JavaScript, WCAG 액세스 가능, 프레임워크에 구애받지 않습니다. Django, HTMX, Laravel 및 모든 프레임워크에서 작동합니다.

Frutjam plugins extend the core library with additional components and integrations beyond standard UI elements. Each plugin is an independent npm package — install only what your project needs and register it with a single @plugin directive alongside your main Frutjam import. Plugins integrate seamlessly with the existing theming system, inheriting your CSS variables and WCAG AA color tokens automatically. Framework-agnostic by design, plugins work with Django, HTMX, Laravel, React, and any Tailwind CSS v4 project.

마크다운 편집기

기본 텍스트 영역을 전체 편집 제품군으로 변환하는 마크다운 텍스트 편집기 플러그인입니다. WYSIWYG 및 일반 마크다운 모드, 실시간 미리보기, RTL 지원, 다크 모드. Django, HTMX, Laravel, React 및 모든 스택에서 작동합니다.

What are plugins?

Frutjam plugins extend the base library with additional components, utilities, or integrations. Each plugin is an independent package you can opt into — install only what you need, keep your CSS bundle lean.

Independent packages

Each plugin is a standalone npm package. Install it alongside Frutjam and register it with a single @plugin directive in your CSS.

Framework-agnostic

Plugins work with any stack — Django, HTMX, Laravel, React, or plain HTML. No framework-specific wrappers required.

How do I install a Frutjam plugin?

Install the plugin via npm and add a @plugin directive to your CSS file. For example: npm i -D frutjam-plugin-name, then add @plugin "frutjam-plugin-name"; below @plugin "frutjam"; in your CSS. That's it — no JavaScript config required.

Are plugins CSS-only?

It depends on the plugin. Pure UI plugins are CSS-only. Some plugins — like the markdown editor — are JavaScript-based because their functionality inherently requires scripting. Each plugin page clearly documents whether JavaScript is required.