Django File Input Component

File Input renders a styled <input type='file'> that matches the daisyUI form palette. Use size and colour variants to keep it consistent with surrounding form elements.

Basic File Input

Preview

Code

<c-lb.file-input />

Color Variants

Preview

Code

<div class="flex flex-col gap-2">
  <c-lb.file-input variant="neutral" />
  <c-lb.file-input variant="primary" />
  <c-lb.file-input variant="secondary" />
  <c-lb.file-input variant="accent" />
  <c-lb.file-input variant="info" />
  <c-lb.file-input variant="success" />
  <c-lb.file-input variant="warning" />
  <c-lb.file-input variant="error" />
</div>

Sizes

Preview

Code

<div class="flex flex-col gap-2">
  <c-lb.file-input size="xs" />
  <c-lb.file-input size="sm" />
  <c-lb.file-input size="md" />
  <c-lb.file-input size="lg" />
  <c-lb.file-input size="xl" />
</div>

With Fieldset

Preview

Pick a file

Max size 2MB

Code

<c-lb.fieldset legend="Pick a file">
  <c-lb.file-input />
  <c-lb.label>Max size 2MB</c-lb.label>
</c-lb.fieldset>

API Reference

`c-lb.file-input`

Property	Type	Default	Required	Description
class	string	-	No	Additional CSS classes to apply
variant	neutral primary secondary accent info success warning error	-	No	File input color variant
size	xs sm md lg xl	`md`	No	File input size
ghost	boolean	`False`	No	Ghost/minimal styling variant
validate	boolean	`False`	No	Enable validation styling