component-framework-ui

CSS framework UI kit for component-framework — Bulma, Bootstrap, Foundation, Fomantic UI, DaisyUI.

CI Docs Python 3.11+ Status: Beta

📖 Full documentation: https://fsecada01.github.io/component-framework-ui/

Fourteen ready-to-use components in two first-class template sets:

Template set Engine Web frameworks
jinja/ Jinja2 / JinjaX FastAPI, Litestar
cotton/ django-cotton Django

Component names are theme-agnostic — <Cf:Card> and <c-cf.card> render whichever theme is active. Switching CSS frameworks means changing one config line, not hundreds of templates.

Install

pip install "cf-ui[django,bulma]"        # Django + Bulma
pip install "cf-ui[fastapi,daisy]"       # FastAPI + Tailwind/DaisyUI
pip install "cf-ui[litestar,bootstrap]"  # Litestar + Bootstrap 5

All template sets ship in every install. Theme selection is runtime config, not install-time.

→ Installation guide

Thirty-second look

{# Django #}
{% load cf_ui %}
<c-cf.card header="Welcome">Card body content.</c-cf.card>
<c-cf.form-field name="email" label="Email" type="email" />

# FastAPI
from jinjax import Catalog

from cf_ui.fastapi import install_cf_ui

catalog = Catalog()
install_cf_ui(catalog, theme="bulma")

html = catalog.render("Cf:Card", header="Welcome", _content="Card body.")

→ Quickstart for all three frameworks

Themes

Theme Status
Bulma ✅
Tailwind + DaisyUI ✅ — guide
Bootstrap 5 ✅ — CSS only, no bootstrap.bundle.js; decision record
Foundation 6 ✅ — CSS only, no jQuery
Fomantic UI ✅ — CSS only, no jQuery

Switching is one line — CF_UI_THEME = "daisy" on Django, theme="daisy" on FastAPI/Litestar — and needs no template edits in the consuming app. An unimplemented theme name is rejected at startup rather than at first render.

Documentation

Page What's in it
Installation Extras, requirements, asset options
Quickstart Django, FastAPI, and Litestar setups
Getting started Themes, assets, composition axes, Alpine, escaping
Use cases HTMX tables, modals, forms with errors
Components All fourteen, with every prop
Escaping Why cf-ui escapes its own output
Theming Composition axes and custom value sets
Tailwind plugin Build-time axis validation
Accessibility Focus management, ARIA, keyboard behavior

Development

git clone https://github.com/fsecada01/component-framework-ui
cd component-framework-ui
uv pip install -e ".[dev]"
playwright install chromium

just test             # unit tests
just test-integration # integration tests
just test-e2e         # E2E Playwright tests (requires chromium)
just test-all         # everything
just lint             # ruff check
just format           # ruff format
just docs             # serve the docs site locally

Requirements

  • Python 3.11+
  • component-framework >= 0.4
  • Pydantic 2.0+ (only mandatory runtime dependency)

Optional extras:

  • [django] — Django 4.2+, django-cotton 2.0+
  • [fastapi] — FastAPI 0.109+, JinjaX 0.41+, uvicorn, python-multipart
  • [litestar] — Litestar 2.0+, Jinja2 3.1+, JinjaX 0.41+

Jinja2 and JinjaX are layers, not alternatives, which is why the Litestar extra names both. Litestar's JinjaTemplateEngine owns the Jinja2 environment, and cf-ui installs a JinjaX catalog onto it — so <Cf:Card> renders from the same template on both paths. The FastAPI extra omits Jinja2 only because JinjaX pulls it in transitively there, where the catalog owns the environment outright.

License

MIT

Project links

Data verified by PyPI on Aug 1, 2026
Data provided by the project maintainers, verified at the time the release was uploaded to PyPI.

Key dates

PyPI data
Data sourced directly from PyPI's database.
  • Released:
Newer release available (0.4.0)

1 maintainer

PyPI data
Data sourced directly from PyPI's database.
Avatar for fsecada01 from gravatar.com fsecada01

Credits

Author: Francis Secada

GitHub Statistics

Data verified by PyPI on Aug 1, 2026
The GitHub source repository was provided by the project maintainers and verified by PyPI at the time of upload. Stars, forks, and open issues/PRs are derived from that repository and have not been independently verified.

License

MIT License (MIT)

Requires

Python >=3.11

Provides Extra

all bootstrap bulma daisy dev django docs fastapi fomantic foundation litestar

Tags

alpinejs bulma components django fastapi htmx litestar

Classifiers

Report project as malware

Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

cf_ui-0.3.0.tar.gz (93.3 kB view details)

Uploaded Source

Built Distribution

If you're not sure about the file name format, learn more about wheel file names.

cf_ui-0.3.0-py3-none-any.whl (183.5 kB view details)

Uploaded Python 3

File details

Details for the file cf_ui-0.3.0.tar.gz.

File metadata

  • Download URL: cf_ui-0.3.0.tar.gz
  • Upload date:
  • Size: 93.3 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? Yes
  • Uploaded via: twine/7.0.0 CPython/3.13.14

File hashes

Hashes for cf_ui-0.3.0.tar.gz
Algorithm Hash digest
SHA256 b33e11b36407287d0e00d1f153159fba52abcfa8a4e801289efedaed714da194
MD5 eaf5a1b547f4163939cfdf0b2d5aa3f2
BLAKE2b-256 3af6d002428d3dc329a6cd4d4908b3b9794cca9835c1f1033ef7b4ad5ab7d64d

See more details on using hashes here.

Provenance

The following attestation bundles were made for cf_ui-0.3.0.tar.gz:

Publisher: release.yml on fsecada01/component-framework-ui

Attestations: Values shown here reflect the state when the release was signed and may no longer be current.

File details

Details for the file cf_ui-0.3.0-py3-none-any.whl.

File metadata

  • Download URL: cf_ui-0.3.0-py3-none-any.whl
  • Upload date:
  • Size: 183.5 kB
  • Tags: Python 3
  • Uploaded using Trusted Publishing? Yes
  • Uploaded via: twine/7.0.0 CPython/3.13.14

File hashes

Hashes for cf_ui-0.3.0-py3-none-any.whl
Algorithm Hash digest
SHA256 4a8cc6fe64c1c76662aee46d0c4407249e020257f2cc7e370a7f0a2b1a2d2006
MD5 1d4289a2d6c1548d501ac5a6b9a93365
BLAKE2b-256 436c29706fc9fcb896c25cce45a1a78a5198fc857689429813760d39b7527b55

See more details on using hashes here.

Provenance

The following attestation bundles were made for cf_ui-0.3.0-py3-none-any.whl:

Publisher: release.yml on fsecada01/component-framework-ui

Attestations: Values shown here reflect the state when the release was signed and may no longer be current.

Release history Release notifications | RSS feed

0.4.0

2 files

0.3.1

2 files

This release

0.3.0 This release

2 files

0.2.0

2 files

Anthropic, PBC Visionary sponsor Bloomberg Visionary sponsor Hudson River Trading Visionary sponsor Meta Visionary sponsor NVIDIA Visionary sponsor Microsoft Sustainability sponsor Depot Continuous Integration AWS Cloud computing and Security Sponsor Datadog Monitoring Fastly CDN Google Download Analytics Sentry Error logging StatusPage Status page