# Drawing, layout, and effects
[Detailed agent guidance](/agents/topics/layout/) · [All capabilities](/reference/)

- [Absolute](/reference/components/absolute/): Places direct children in one declared container box.
- [AnchoredLayout](/reference/components/anchored-layout/): Arranges keyed boxes without covering one another or their anchors.
- [Arc](/reference/components/arc/): Draws an open circular stroke sweep.
- [Circle](/reference/components/circle/): Draws a center-and-radius circle with local paint and interaction.
- [Clip](/reference/components/clip/): Restricts recursive children to a Path2D or PathGeometry clipping region.
- [Ellipse](/reference/components/ellipse/): Draws a rotated ellipse from independent radii.
- [Flex](/reference/components/flex/): Arranges direct children with Pibbl's explicit Flexbox subset.
- [Flow](/reference/components/flow/): Places direct children in the declared flow direction.
- [Grid](/reference/components/grid/): Places direct children in Pibbl's explicit Grid subset.
- [Group](/reference/components/group/): Applies a Canvas transform to recursive children.
- [HorizontalLine](/reference/components/horizontal-line/): Draws an allocation-aware horizontal line.
- [Image](/reference/components/image/): Draws an asynchronously decoded browser image.
- [Layer](/reference/components/layer/): Caches recursive children in a persistent offscreen Pibbl instance.
- [Line](/reference/components/line/): Draws an ordered polyline.
- [Overlay](/reference/components/overlay/): Places direct children on a shared declared box.
- [Path](/reference/components/path/): Paints a caller-owned Path2D with local interaction and style.
- [Polygon](/reference/components/polygon/): Draws a closed polygon from numeric coordinate pairs.
- [Rectangle](/reference/components/rectangle/): Draws a local rectangle with paint, events, and optional rounded corners.
- [RegularPolygon](/reference/components/regular-polygon/): Draws a generated regular polygon with one explicit size mode.
- [Star](/reference/components/star/): Draws one concave alternating-tip star outline.
- [SvgPath](/reference/components/svg-path/): Draws browser-parsed SVG path data.
- [Text](/reference/components/text/): Draws recursive textual children with local fitting and paint.
- [VerticalLine](/reference/components/vertical-line/): Draws an allocation-aware vertical line.
- [Wedge](/reference/components/wedge/): Draws a filled or stroked center-closed circular sector.
- [createArcPath](/reference/functions/create-arc-path/): Creates a fresh open circular Path2D sweep.
- [createCirclePath](/reference/functions/create-circle-path/): Creates a fresh numeric circular Path2D.
- [createEllipsePath](/reference/functions/create-ellipse-path/): Creates a fresh numeric elliptical Path2D.
- [createLinePath](/reference/functions/create-line-path/): Creates a fresh numeric polyline Path2D.
- [createPolygonPath](/reference/functions/create-polygon-path/): Creates a fresh rounded or sharp numeric polygon Path2D.
- [createRectanglePath](/reference/functions/create-rectangle-path/): Creates a fresh numeric rectangular Path2D.
- [createRegularPolygonPath](/reference/functions/create-regular-polygon-path/): Creates a fresh generated regular-polygon Path2D.
- [createStarPath](/reference/functions/create-star-path/): Creates a fresh alternating-tip star Path2D.
- [createSvgPath](/reference/functions/create-svg-path/): Creates a fresh browser-parsed SVG Path2D.
- [createWedgePath](/reference/functions/create-wedge-path/): Creates a fresh center-closed circular-sector Path2D.
- [LayoutDiagnostic and layoutDiagnostic](/reference/functions/layout-diagnostic/): Creates contextual errors for invalid style, geometry, and layout values.
- [measureElement](/reference/functions/measure-element/): Purely asks an opt-in primitive for a constrained measurement.
- [Path bending](/reference/functions/path-bending/): Define reusable arc and path bends and compose them with other geometry mappings.
- [PathGeometry](/reference/functions/path-geometry/): Build and edit packed path geometry and export independent native or SVG snapshots.
- [Composable path transforms](/reference/functions/path-transforms/): Compose envelope, four-corner, and affine mappings before approximating editable geometry.
- [useCanvasContext](/reference/hooks/use-canvas-context/): Returns the current component's isolated Canvas 2D context.
- [useFlowField2D and useFlowSource2D](/reference/hooks/use-flow-field/): Share a component-owned velocity field and localized force or heat sources.
- [useLayoutBox](/reference/hooks/use-layout-box/): Returns the current child-local allocated layout box.
- [useLinePath](/reference/hooks/use-line-path/): Memoizes a Path2D for numeric line coordinates.
- [useRectPath](/reference/hooks/use-rect-path/): Memoizes a rectangular Path2D with optional rounding and pixel alignment.
- [useSvgPath](/reference/hooks/use-svg-path/): Memoizes a Path2D from SVG path data.
- [Filters](/reference/types/filters/): Import appearance-only filter factories without including unused effects.
- [Layout types](/reference/types/layout/): Declared-box, measurement, and explicit layout-component contracts.
- [Style and primitive types](/reference/types/styles/): Local drawing styles, shared paint vocabularies, and primitive-extension contracts.
## Documentation version

Documentation built with @pibbl/core 0.0.2, revision 272a94a. ALPHA — NOT FOR PRODUCTION USE.