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 2, 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 2, 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.1.tar.gz (95.0 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.1-py3-none-any.whl (185.7 kB view details)

Uploaded Python 3

File details

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

File metadata

  • Download URL: cf_ui-0.3.1.tar.gz
  • Upload date:
  • Size: 95.0 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.1.tar.gz
Algorithm Hash digest
SHA256 627a2aadbf0ecdf1259397dcf96435b3557037304f87b1753d6a20ce4079ac9e
MD5 d6f02ca179cc6506b4faf752e5d77a44
BLAKE2b-256 aa4aea5b9a9c79b06b0d1f6339e86ba66e40a744f040e895b5a57578accee739

See more details on using hashes here.

Provenance

The following attestation bundles were made for cf_ui-0.3.1.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.1-py3-none-any.whl.

File metadata

  • Download URL: cf_ui-0.3.1-py3-none-any.whl
  • Upload date:
  • Size: 185.7 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.1-py3-none-any.whl
Algorithm Hash digest
SHA256 0c210e2a79ec6e898e3625b6b7e4b24a353c54b50b2018377d331c800668854a
MD5 460472b552ab8f4c2d16e1e2c0f95edf
BLAKE2b-256 0cc27a36d2afc0f2de8c1c354ea554d4d0e30824ccda483c9d13bdcb3b8c7f88

See more details on using hashes here.

Provenance

The following attestation bundles were made for cf_ui-0.3.1-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

This release

0.3.1 This release

2 files

0.3.0

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