/Knowledge/sources/honojs__hono/llms-full/css-helper-cx--fb4bbe209625.md
css Helper: cx - hono-docs
css Helper: cx Source evidence: /Sources/honojs hono/provenance.md Canonical citation: https://hono.dev/llms full.txt cx Summary The cx composites the two cl...
css Helper: cx
Source evidence: /Sources/honojs__hono/provenance.md Canonical citation: https://hono.dev/llms-full.txt#cx
Summary
The cx composites the two class names. tsx const buttonClass = css` border-radius: 10px; ` const primaryClass = css` background: orange; ` const Button = () => ( Click! ) It can also compose simple strings. ```tsx const Header =...
Content
The cx composites the two class names.
const buttonClass = css`
border-radius: 10px;
`
const primaryClass = css`
background: orange;
`
const Button = () => (
<a class={cx(buttonClass, primaryClass)}>Click!</a>
)
It can also compose simple strings.
const Header = () => <a class={cx('h1', primaryClass)}>Hi</a>
Metadata
{
"chunk_index": 0,
"citation": "https://hono.dev/llms-full.txt#cx",
"coverage_role": "overview",
"qualified_title": "Hono / llms-full / css Helper > `cx`",
"retrieved_at": "2026-07-02T05:51:01Z",
"section_index": 699,
"source_id": "/honojs/hono",
"source_type": "llms_full",
"target_label": "llms-full",
"title": "css Helper: cx",
"upstream_url": "https://hono.dev/llms-full.txt",
"version": "2026"
}