README
¶
HTML Builder
About
HTML Builder is a lightweight Go package designed to construct fully featured HTML5 markup, CSS styling, and vanilla JavaScript components—all using Go syntax. Write your entire front-end structure directly in Go and generate clean, performant, and standard-compliant web layouts without leaving your Go environment. View an Example
Features
- Build nested structures using Go syntax, catching tag and syntax errors at compile time.
- Define component styles directly alongside your markup, keeping everything in Go.
- Easily inject script blocks and event handlers to make your components interactive.
- Lightweight and self-contained, built purely on the Go standard library.
- Instantly compile your Go structures into clean, production-ready HTML5 strings.
Usage
The godoc includes docs for all methods and event types.
Click here to view a simple code example!
package main
import (
"fmt"
"log"
"net/http"
"github.com/Thruqe/htmlbuilder"
)
var PORT = ":8080"
func main() {
http.HandleFunc("/", handler)
log.Println("listening on http://localhost:8080")
if err := http.ListenAndServe(PORT, nil); err != nil {
log.Fatal(err)
}
}
func handler(w http.ResponseWriter, r *http.Request) {
fmt.Fprintln(w, simple_landing_page())
}
func simple_landing_page() string {
doc := htmlbuilder.New().
Title("Simple Landing Page").
MetaDefault().
Link(map[string]string{
"rel": "stylesheet",
"href": "https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap",
}).
Link(map[string]string{
"rel": "stylesheet",
"href": "https://cdn-uicons.flaticon.com/2.6.0/uicons-regular-rounded/css/uicons-regular-rounded.css",
}).
// Cleaned up mobile responsive layout math
StyleBlock(`
html {
scroll-behavior: smooth;
}
/* Only enable snap-scrolling on large screens where content comfortably fits */
@media (min-width: 769px) {
html {
scroll-snap-type: y mandatory;
}
section, footer {
scroll-snap-align: start;
scroll-snap-stop: always;
}
}
/* Smooth-slide & Fade-in/out Dropdown Animation */
.mobile-menu {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 1.25rem;
position: fixed;
top: 65px;
left: 0;
right: 0;
background: rgba(248, 250, 252, 0.96);
border-bottom: 1px solid rgba(226, 232, 240, 0);
padding: 0;
z-index: 999;
backdrop-filter: blur(16px);
-webkit-backdrop-filter: blur(16px);
max-height: 0;
opacity: 0;
overflow: hidden;
transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1),
opacity 0.25s ease,
padding 0.35s ease,
border-color 0.35s ease;
}
.mobile-menu.active {
max-height: 220px;
opacity: 1;
padding: 2rem 1.5rem;
border-color: rgba(226, 232, 240, 1);
}
/* Mobile Tweaks */
@media (max-width: 768px) {
.desktop-links {
display: none !important;
}
.hamburger-btn {
display: flex !important;
}
h1 {
font-size: 2.25rem !important; /* Smaller headings so they don't break wraps */
}
h2 {
font-size: 1.75rem !important;
margin-bottom: 1.5rem !important;
}
.features-grid {
grid-template-columns: 1fr !important;
gap: 1rem !important;
}
section {
padding: 6rem 1rem 3rem !important; /* Extra breathing padding at top for the fixed header */
height: auto !important; /* Reset strict height to avoid cutoffs */
min-height: 100vh !important; /* Fallback layout target */
}
}
`)
// Global Reset & Light Theme Styles
doc.Body().CSS(htmlbuilder.Style{
Margin: "0",
Padding: "0",
FontFamily: "'Plus Jakarta Sans', sans-serif",
Background: "#f8fafc",
Color: "#0f172a",
})
// Hamburger Menu Button
hamburgerBtn := htmlbuilder.El("button").
Class("hamburger-btn").
Attr("aria-label", "Toggle Menu").
Attr("onclick", "document.getElementById('mobile-dropdown').classList.toggle('active')").
Child(
htmlbuilder.El("i").Class("fi", "fi-rr-menu-burger").CSS(htmlbuilder.Style{
FontSize: "1.25rem",
Color: "#0f172a",
}),
).
CSS(htmlbuilder.Style{
Display: "none",
Background: "none",
Border: "none",
Cursor: "pointer",
Padding: "4px",
})
// 1. Navigation / Header Component
navBar := htmlbuilder.El("nav").Child(
htmlbuilder.Span("GoHTML").CSS(htmlbuilder.Style{
FontWeight: "800",
FontSize: "1.4rem",
Color: "#087ea4",
}),
htmlbuilder.El("div").Class("desktop-links").Child(
htmlbuilder.A("Home").Attr("href", "#home").CSS(navLinkStyle()),
htmlbuilder.A("Features").Attr("href", "#features").CSS(navLinkStyle()),
htmlbuilder.A("GitHub").Attr("href", "https://github.com/Thruqe/htmlbuilder").CSS(navLinkStyle()),
).CSS(htmlbuilder.Style{
Display: "flex",
Gap: "1.5rem",
}),
hamburgerBtn,
).CSS(htmlbuilder.Style{
Display: "flex",
JustifyContent: "space-between",
AlignItems: "center",
Padding: "1.25rem 2rem",
MaxWidth: "1200px",
Margin: "0 auto",
Width: "100%",
BoxSizing: "border-box",
Position: "fixed",
Top: "0",
Left: "0",
Right: "0",
ZIndex: "1000",
Background: "rgba(248, 250, 252, 0.8)",
BorderBottom: "1px solid rgba(226, 232, 240, 0.8)",
}).SetStyle("backdrop-filter", "blur(12px)").
SetStyle("-webkit-backdrop-filter", "blur(12px)")
// Mobile Dropdown Menu Component
mobileDropdown := htmlbuilder.El("div").
Class("mobile-menu").
Attr("id", "mobile-dropdown").
Child(
htmlbuilder.A("Home").
Attr("href", "#home").
Attr("onclick", "document.getElementById('mobile-dropdown').classList.remove('active')").
CSS(mobileNavLinkStyle()). // Sets size, decoration, etc.
// Set the base color using custom style properties (so they don't block hover)
SetStyle("color", "inherit").
Hover(htmlbuilder.Style{Color: "#087ea4"}),
htmlbuilder.A("Features").
Attr("href", "#features").
Attr("onclick", "document.getElementById('mobile-dropdown').classList.remove('active')").
CSS(mobileNavLinkStyle()).
SetStyle("color", "inherit").
Hover(htmlbuilder.Style{Color: "#087ea4"}),
htmlbuilder.A("GitHub").
Attr("href", "https://github.com/Thruqe/htmlbuilder").
CSS(mobileNavLinkStyle()).
SetStyle("color", "inherit").
Hover(htmlbuilder.Style{Color: "#087ea4"}),
)
// 2. Hero Section
heroSection := htmlbuilder.El("section").
Attr("id", "home").
Child(
htmlbuilder.El("div").Child(
htmlbuilder.H1("Pure Go. Zero Templates.").
CSS(htmlbuilder.Style{
FontSize: "3.5rem",
FontWeight: "800",
LineHeight: "1.2",
Margin: "0 0 1.5rem",
Background: "linear-gradient(to right, #087ea4, #149eca)",
}).
SetStyle("-webkit-background-clip", "text").
SetStyle("-webkit-text-fill-color", "transparent"),
htmlbuilder.P("Build beautifully structured, type-safe web pages straight from your Go backend without touching a single raw template file.").CSS(htmlbuilder.Style{
Color: "#475569",
FontSize: "1.2rem",
LineHeight: "1.6",
Margin: "0 auto 2.5rem",
MaxWidth: "620px",
FontWeight: "500",
}),
htmlbuilder.A("Get Started").
Attr("href", "#features").
CSS(htmlbuilder.Style{
Background: "#087ea4",
Color: "#ffffff",
Padding: "0.8rem 2rem",
BorderRadius: "10px",
FontWeight: "600",
TextDecoration: "none",
Transition: "all 0.2s ease",
BoxShadow: "0 4px 12px rgba(8, 126, 164, 0.15)",
}).
Hover(htmlbuilder.Style{
Transform: "translateY(-2px)",
BoxShadow: "0 6px 20px rgba(8, 126, 164, 0.25)",
}),
),
).CSS(htmlbuilder.Style{
Display: "flex",
AlignItems: "center",
JustifyContent: "center",
Height: "100vh",
MinHeight: "100vh",
BoxSizing: "border-box",
Padding: "0 1.5rem",
})
// 3. Features Section
featuresData := []struct {
title string
desc string
}{
{"Declarative API", "Define UI structures cleanly with nested Go functions instead of parsing HTML fragments at runtime."},
{"Type-Safe CSS", "Construct inline designs leveraging typed style structures, reducing property typos and layout errors."},
{"Zero Dependencies", "Compiles down instantly to your Go binary, avoiding bloated external toolchains or node modules."},
}
featuresSection := htmlbuilder.El("section").
Attr("id", "features").
Child(
htmlbuilder.El("div").Child(
htmlbuilder.H2("Everything you need, built natively").CSS(htmlbuilder.Style{
FontSize: "2.25rem",
FontWeight: "800",
TextAlign: "center",
Margin: "0 0 3rem",
Color: "#0f172a",
}),
htmlbuilder.El("div").Class("features-grid").Child(
htmlbuilder.Each(featuresData, func(f struct {
title string
desc string
}) *htmlbuilder.Node {
return htmlbuilder.El("div").Child(
htmlbuilder.H3(f.title).CSS(htmlbuilder.Style{
FontSize: "1.2rem",
FontWeight: "700",
Margin: "0 0 0.75rem",
Color: "#0f172a",
}),
htmlbuilder.P(f.desc).CSS(htmlbuilder.Style{
Color: "#475569",
FontSize: "0.95rem",
LineHeight: "1.5",
Margin: "0",
}),
).CSS(htmlbuilder.Style{
Background: "#ffffff",
Border: "1px solid #e2e8f0",
BorderRadius: "12px",
Padding: "2rem",
Transition: "all 0.2s ease",
}).Hover(htmlbuilder.Style{
BorderColor: "#087ea4",
BoxShadow: "0 10px 25px rgba(0,0,0,0.03)",
})
})...,
).CSS(htmlbuilder.Style{
Display: "grid",
GridTemplateColumns: "repeat(auto-fit, minmax(280px, 1fr))",
Gap: "2rem",
Width: "100%",
}),
).CSS(htmlbuilder.Style{
MaxWidth: "1000px",
Margin: "0 auto",
Width: "100%",
BoxSizing: "border-box",
}),
).CSS(htmlbuilder.Style{
Display: "flex",
AlignItems: "center",
JustifyContent: "center",
Height: "100vh",
MinHeight: "100vh",
BoxSizing: "border-box",
Padding: "0 2rem",
})
// 4. Footer
footer := htmlbuilder.El("footer").Child(
htmlbuilder.El("div").Child(
htmlbuilder.P("© 2026 Built with love").CSS(htmlbuilder.Style{
Color: "#94a3b8",
FontSize: "0.9rem",
Margin: "0",
FontWeight: "500",
}),
),
).CSS(htmlbuilder.Style{
Display: "flex",
AlignItems: "center",
JustifyContent: "center",
Height: "25vh",
BorderTop: "1px solid #e2e8f0",
Background: "#f1f5f9",
})
// Build Page
doc.Body().Child(navBar, mobileDropdown, heroSection, featuresSection, footer)
return doc.String()
}
func navLinkStyle() htmlbuilder.Style {
return htmlbuilder.Style{
Color: "#475569",
TextDecoration: "none",
FontWeight: "600",
Transition: "color 0.15s ease",
}
}
// Mobile Dropdown Nav Link Style Helper (Lighter, smaller, normal weight)
func mobileNavLinkStyle() htmlbuilder.Style {
return htmlbuilder.Style{
// Color is omitted here so SetStyle("color", "inherit") and .Hover() can work without specificity blockages!
TextDecoration: "none",
FontWeight: "400", // Normal weight, not bold
FontSize: "1rem", // Smaller font size
Transition: "color 0.15s ease",
}
}
Contributing
I love pull requests! Feel free to submit a PR to help make this project better.
License
This project is MIT LICENSED
Documentation
¶
Overview ¶
style.go
Code generated by cmd/gencss from mdn/data; DO NOT EDIT.
Code generated by cmd/gentags; DO NOT EDIT.
Index ¶
- func Pct[T int | float64](v T) string
- func Px[T int | float64](v T) string
- func Rem[T int | float64](v T) string
- type Document
- func (d *Document) Body() *Node
- func (d *Document) Head() *Node
- func (d *Document) Icon(href, mimeType string) *Document
- func (d *Document) Lang(l string) *Document
- func (d *Document) Link(attrs map[string]string) *Document
- func (d *Document) Meta(attrs map[string]string) *Document
- func (d *Document) MetaDefault() *Document
- func (d *Document) Render(w io.Writer)
- func (d *Document) Script(js string) *Document
- func (d *Document) String() string
- func (d *Document) StyleBlock(css string) *Document
- func (d *Document) Title(t string) *Document
- type Node
- func A(text string) *Node
- func Abbr(text string) *Node
- func Address(children ...*Node) *Node
- func Area() *Node
- func Article(children ...*Node) *Node
- func Aside(children ...*Node) *Node
- func Audio(children ...*Node) *Node
- func B(text string) *Node
- func Base() *Node
- func Bdi(text string) *Node
- func Bdo(text string) *Node
- func Blockquote(children ...*Node) *Node
- func Body(children ...*Node) *Node
- func Br() *Node
- func Button(children ...*Node) *Node
- func Canvas(children ...*Node) *Node
- func Caption(text string) *Node
- func Cite(text string) *Node
- func Code(text string) *Node
- func Col() *Node
- func Colgroup(children ...*Node) *Node
- func Data(text string) *Node
- func Datalist(children ...*Node) *Node
- func Dd(children ...*Node) *Node
- func Del(text string) *Node
- func Details(children ...*Node) *Node
- func Dfn(text string) *Node
- func Dialog(children ...*Node) *Node
- func Div(children ...*Node) *Node
- func Dl(children ...*Node) *Node
- func Dt(text string) *Node
- func Each[T any](items []T, fn func(T) *Node) []*Node
- func El(tag string) *Node
- func Em(text string) *Node
- func Embed() *Node
- func Fieldset(children ...*Node) *Node
- func Figcaption(children ...*Node) *Node
- func Figure(children ...*Node) *Node
- func Footer(children ...*Node) *Node
- func Form(children ...*Node) *Node
- func H1(text string) *Node
- func H2(text string) *Node
- func H3(text string) *Node
- func H4(text string) *Node
- func H5(text string) *Node
- func H6(text string) *Node
- func Head(children ...*Node) *Node
- func Header(children ...*Node) *Node
- func Hgroup(children ...*Node) *Node
- func Hr() *Node
- func Html(children ...*Node) *Node
- func I(text string) *Node
- func Iframe() *Node
- func Img() *Node
- func Input() *Node
- func Ins(text string) *Node
- func Kbd(text string) *Node
- func Label(text string) *Node
- func Legend(text string) *Node
- func Li(children ...*Node) *Node
- func Link() *Node
- func Main(children ...*Node) *Node
- func Map(children ...*Node) *Node
- func Mark(text string) *Node
- func Menu(children ...*Node) *Node
- func Meta() *Node
- func Meter(text string) *Node
- func Nav(children ...*Node) *Node
- func Noscript(children ...*Node) *Node
- func Object(children ...*Node) *Node
- func Ol(children ...*Node) *Node
- func Optgroup(children ...*Node) *Node
- func Option(text string) *Node
- func Output(text string) *Node
- func P(text string) *Node
- func Picture(children ...*Node) *Node
- func Pre(text string) *Node
- func Progress(text string) *Node
- func Q(text string) *Node
- func Rp(text string) *Node
- func Rt(text string) *Node
- func Ruby(children ...*Node) *Node
- func S(text string) *Node
- func Samp(text string) *Node
- func Script(text string) *Node
- func Search(children ...*Node) *Node
- func Section(children ...*Node) *Node
- func Select(children ...*Node) *Node
- func Slot(children ...*Node) *Node
- func Small(text string) *Node
- func Source() *Node
- func Span(text string) *Node
- func Strong(text string) *Node
- func Sub(text string) *Node
- func Summary(text string) *Node
- func Sup(text string) *Node
- func Table(children ...*Node) *Node
- func Tbody(children ...*Node) *Node
- func Td(children ...*Node) *Node
- func Template(children ...*Node) *Node
- func Textarea(text string) *Node
- func Tfoot(children ...*Node) *Node
- func Th(children ...*Node) *Node
- func Thead(children ...*Node) *Node
- func Time(text string) *Node
- func Title(text string) *Node
- func Tr(children ...*Node) *Node
- func Track() *Node
- func U(text string) *Node
- func Ul(children ...*Node) *Node
- func Var(text string) *Node
- func Video(children ...*Node) *Node
- func Wbr() *Node
- func (n *Node) Active(s Style) *Node
- func (n *Node) After(s Style) *Node
- func (n *Node) Attr(key, value string) *Node
- func (n *Node) Before(s Style) *Node
- func (n *Node) CSS(s Style) *Node
- func (n *Node) Child(children ...*Node) *Node
- func (n *Node) Class(classes ...string) *Node
- func (n *Node) Focus(s Style) *Node
- func (n *Node) Hover(s Style) *Node
- func (n *Node) HoverAfter(s Style) *Node
- func (n *Node) HoverBefore(s Style) *Node
- func (n *Node) HoverPseudo(name string, s Style) *Node
- func (n *Node) If(cond bool, fn func(*Node)) *Node
- func (n *Node) Pseudo(name string, s Style) *Node
- func (n *Node) Raw(html string) *Node
- func (n *Node) Render(w io.Writer)
- func (n *Node) SetStyle(prop, value string) *Node
- func (n *Node) String() string
- func (n *Node) StyleClass(s Style) *Node
- func (n *Node) Text(t string) *Node
- type Style
Constants ¶
This section is empty.
Variables ¶
This section is empty.
Functions ¶
Types ¶
type Document ¶
type Document struct {
// contains filtered or unexported fields
}
Document represents a full HTML page: doctype, <html lang="...">, <head>, and <body>.
func New ¶
func New() *Document
New creates a new Document with sensible defaults: lang="en", empty <head> and <body>.
func (*Document) Icon ¶
Icon appends a <link rel="icon"> tag to <head>. Covers favicons, PNG icons, and Flaticon/CDN-hosted icon assets alike — just a URL and optional type/sizes.
Usage:
doc.Icon("/favicon.ico", "")
doc.Icon("https://cdn-icons-png.flaticon.com/512/xxx/xxx.png", "image/png")
func (*Document) Link ¶
Link appends a <link> tag to <head>, e.g. for stylesheets. Usage: doc.Link(map[string]string{"rel": "stylesheet", "href": "/style.css"})
func (*Document) Meta ¶
Meta appends a <meta> tag to <head> with the given attributes. Usage: doc.Meta(map[string]string{"charset": "utf-8"})
func (*Document) MetaDefault ¶
MetaDefault appends common, standard <meta> tags (charset and viewport) to the <head>. Usage: doc.MetaDefault()
func (*Document) Render ¶
Render writes the Document as a complete HTML document, including doctype, to w.
func (*Document) Script ¶
Script appends a raw <script>...</script> tag to <head> (or call on doc.Body() equivalent if you want it at the end of body instead — this version targets head).
func (*Document) String ¶
String renders the Document to a string. Convenience wrapper around Render for cases where you don't have an io.Writer handy (tests, debugging, etc.) — prefer Render(w) in HTTP handlers to avoid the extra allocation.
func (*Document) StyleBlock ¶
StyleBlock appends a raw <style>...</style> tag to <head>. Use this for :root custom properties, @font-face, @import, or any CSS you want embedded directly rather than linked externally.
Usage:
doc.StyleBlock(`
:root {
--primary: #1a1a1a;
--font-body: "Inter", sans-serif;
}
`)
type Node ¶
type Node struct {
// contains filtered or unexported fields
}
func Blockquote ¶
func Each ¶
Each runs fn once per item in items, returning one node per item. Useful in place of {{range}}: Ul(Each(items, func(i Item) *Node {...})...)
func Figcaption ¶
func (*Node) Attr ¶
Attr sets an arbitrary HTML attribute. Repeated calls with the same key overwrite the previous value.
func (*Node) HoverAfter ¶
HoverAfter attaches a :hover::after rule.
func (*Node) HoverBefore ¶
HoverBefore attaches a :hover::before rule.
func (*Node) HoverPseudo ¶
HoverPseudo attaches a :hover::<name> rule.
func (*Node) If ¶
If conditionally applies fn to the node, returning n either way — keeps the fluent chain intact without needing an if-statement break.
func (*Node) Raw ¶
Raw sets unescaped HTML content for this node. Caller is responsible for ensuring the content is safe — no escaping is applied at render time.
func (*Node) SetStyle ¶
SetStyle sets one raw CSS property directly — escape hatch for properties not covered by the generated Style struct (e.g. an unreleased/experimental property, or a custom property like "--my-var").
func (*Node) StyleClass ¶
StyleClass generates a unique class for these styles instead of writing them inline. This allows pseudo-classes like :hover to override the base properties naturally.
type Style ¶
type Style struct {
MozAppearance string
MozBinding string
MozBorderBottomColors string
MozBorderLeftColors string
MozBorderRightColors string
MozBorderTopColors string
MozContextProperties string
MozFloatEdge string
MozForceBrokenImageIcon string
MozOrient string
MozOutlineRadius string
MozOutlineRadiusBottomleft string
MozOutlineRadiusBottomright string
MozOutlineRadiusTopleft string
MozOutlineRadiusTopright string
MozStackSizing string
MozTextBlink string
MozUserFocus string
MozUserInput string
MozUserModify string
MozWindowDragging string
MozWindowShadow string
MsAccelerator string
MsBlockProgression string
MsContentZoomChaining string
MsContentZoomLimit string
MsContentZoomLimitMax string
MsContentZoomLimitMin string
MsContentZoomSnap string
MsContentZoomSnapPoints string
MsContentZoomSnapType string
MsContentZooming string
MsFilter string
MsFlowFrom string
MsFlowInto string
MsGridColumns string
MsGridRows string
MsHighContrastAdjust string
MsHyphenateLimitChars string
MsHyphenateLimitLines string
MsHyphenateLimitZone string
MsImeAlign string
MsOverflowStyle string
MsScrollChaining string
MsScrollLimit string
MsScrollLimitXMax string
MsScrollLimitXMin string
MsScrollLimitYMax string
MsScrollLimitYMin string
MsScrollRails string
MsScrollSnapPointsX string
MsScrollSnapPointsY string
MsScrollSnapType string
MsScrollSnapX string
MsScrollSnapY string
MsScrollTranslation string
MsScrollbar3dlightColor string
MsScrollbarArrowColor string
MsScrollbarBaseColor string
MsScrollbarDarkshadowColor string
MsScrollbarFaceColor string
MsScrollbarHighlightColor string
MsScrollbarShadowColor string
MsScrollbarTrackColor string
MsTextAutospace string
MsTouchSelect string
MsUserSelect string
MsWrapFlow string
MsWrapMargin string
MsWrapThrough string
WebkitAppearance string
WebkitBorderAfter string
WebkitBorderAfterColor string
WebkitBorderAfterStyle string
WebkitBorderAfterWidth string
WebkitBorderBefore string
WebkitBorderBeforeColor string
WebkitBorderBeforeStyle string
WebkitBorderBeforeWidth string
WebkitBorderEnd string
WebkitBorderEndColor string
WebkitBorderEndStyle string
WebkitBorderEndWidth string
WebkitBorderStart string
WebkitBorderStartColor string
WebkitBorderStartStyle string
WebkitBorderStartWidth string
WebkitBoxReflect string
WebkitLineClamp string
WebkitMask string
WebkitMaskAttachment string
WebkitMaskClip string
WebkitMaskComposite string
WebkitMaskImage string
WebkitMaskOrigin string
WebkitMaskPosition string
WebkitMaskPositionX string
WebkitMaskPositionY string
WebkitMaskRepeat string
WebkitMaskRepeatX string
WebkitMaskRepeatY string
WebkitMaskSize string
WebkitOverflowScrolling string
WebkitTapHighlightColor string
WebkitTextFillColor string
WebkitTextStroke string
WebkitTextStrokeColor string
WebkitTextStrokeWidth string
WebkitTouchCallout string
WebkitUserModify string
WebkitUserSelect string
AccentColor string
AlignContent string
AlignItems string
AlignSelf string
AlignTracks string
AlignmentBaseline string
All string
AnchorName string
AnchorScope string
Animation string
AnimationComposition string
AnimationDelay string
AnimationDirection string
AnimationDuration string
AnimationFillMode string
AnimationIterationCount string
AnimationName string
AnimationPlayState string
AnimationRange string
AnimationRangeEnd string
AnimationRangeStart string
AnimationTimeline string
AnimationTimingFunction string
AnimationTrigger string
Appearance string
AspectRatio string
BackdropFilter string
BackfaceVisibility string
Background string
BackgroundAttachment string
BackgroundBlendMode string
BackgroundClip string
BackgroundColor string
BackgroundImage string
BackgroundOrigin string
BackgroundPosition string
BackgroundPositionX string
BackgroundPositionY string
BackgroundRepeat string
BackgroundSize string
BaselineShift string
BaselineSource string
BlockSize string
Border string
BorderBlock string
BorderBlockColor string
BorderBlockEnd string
BorderBlockEndColor string
BorderBlockEndStyle string
BorderBlockEndWidth string
BorderBlockStart string
BorderBlockStartColor string
BorderBlockStartStyle string
BorderBlockStartWidth string
BorderBlockStyle string
BorderBlockWidth string
BorderBottom string
BorderBottomColor string
BorderBottomLeftRadius string
BorderBottomRightRadius string
BorderBottomStyle string
BorderBottomWidth string
BorderCollapse string
BorderColor string
BorderEndEndRadius string
BorderEndStartRadius string
BorderImage string
BorderImageOutset string
BorderImageRepeat string
BorderImageSlice string
BorderImageSource string
BorderImageWidth string
BorderInline string
BorderInlineColor string
BorderInlineEnd string
BorderInlineEndColor string
BorderInlineEndStyle string
BorderInlineEndWidth string
BorderInlineStart string
BorderInlineStartColor string
BorderInlineStartStyle string
BorderInlineStartWidth string
BorderInlineStyle string
BorderInlineWidth string
BorderLeft string
BorderLeftColor string
BorderLeftStyle string
BorderLeftWidth string
BorderRadius string
BorderRight string
BorderRightColor string
BorderRightStyle string
BorderRightWidth string
BorderShape string
BorderSpacing string
BorderStartEndRadius string
BorderStartStartRadius string
BorderStyle string
BorderTop string
BorderTopColor string
BorderTopLeftRadius string
BorderTopRightRadius string
BorderTopStyle string
BorderTopWidth string
BorderWidth string
Bottom string
BoxAlign string
BoxDecorationBreak string
BoxDirection string
BoxFlex string
BoxFlexGroup string
BoxLines string
BoxOrdinalGroup string
BoxOrient string
BoxPack string
BoxShadow string
BoxSizing string
BreakAfter string
BreakBefore string
BreakInside string
CaptionSide string
Caret string
CaretAnimation string
CaretColor string
CaretShape string
Clear string
Clip string
ClipPath string
ClipRule string
Color string
ColorInterpolationFilters string
ColorScheme string
ColumnCount string
ColumnFill string
ColumnGap string
ColumnHeight string
ColumnRule string
ColumnRuleColor string
ColumnRuleStyle string
ColumnRuleWidth string
ColumnSpan string
ColumnWidth string
ColumnWrap string
Columns string
Contain string
ContainIntrinsicBlockSize string
ContainIntrinsicHeight string
ContainIntrinsicInlineSize string
ContainIntrinsicSize string
ContainIntrinsicWidth string
Container string
ContainerName string
ContainerType string
Content string
ContentVisibility string
CornerBlockEndShape string
CornerBlockStartShape string
CornerBottomLeftShape string
CornerBottomRightShape string
CornerBottomShape string
CornerEndEndShape string
CornerEndStartShape string
CornerInlineEndShape string
CornerInlineStartShape string
CornerLeftShape string
CornerRightShape string
CornerShape string
CornerStartEndShape string
CornerStartStartShape string
CornerTopLeftShape string
CornerTopRightShape string
CornerTopShape string
CounterIncrement string
CounterReset string
CounterSet string
Cursor string
Cx string
Cy string
D string
Direction string
Display string
DominantBaseline string
DynamicRangeLimit string
EmptyCells string
FieldSizing string
Fill string
FillOpacity string
FillRule string
Filter string
Flex string
FlexBasis string
FlexDirection string
FlexFlow string
FlexGrow string
FlexShrink string
FlexWrap string
Float string
FloodColor string
FloodOpacity string
Font string
FontFamily string
FontFeatureSettings string
FontKerning string
FontLanguageOverride string
FontOpticalSizing string
FontPalette string
FontSize string
FontSizeAdjust string
FontSmooth string
FontStretch string
FontStyle string
FontSynthesis string
FontSynthesisPosition string
FontSynthesisSmallCaps string
FontSynthesisStyle string
FontSynthesisWeight string
FontVariant string
FontVariantAlternates string
FontVariantCaps string
FontVariantEastAsian string
FontVariantEmoji string
FontVariantLigatures string
FontVariantNumeric string
FontVariantPosition string
FontVariationSettings string
FontWeight string
FontWidth string
ForcedColorAdjust string
FrameSizing string
Gap string
Grid string
GridArea string
GridAutoColumns string
GridAutoFlow string
GridAutoRows string
GridColumn string
GridColumnEnd string
GridColumnGap string
GridColumnStart string
GridGap string
GridRow string
GridRowEnd string
GridRowGap string
GridRowStart string
GridTemplate string
GridTemplateAreas string
GridTemplateColumns string
GridTemplateRows string
HangingPunctuation string
Height string
HyphenateCharacter string
HyphenateLimitChars string
Hyphens string
ImageOrientation string
ImageRendering string
ImageResolution string
ImeMode string
InitialLetter string
InitialLetterAlign string
InlineSize string
Inset string
InsetBlock string
InsetBlockEnd string
InsetBlockStart string
InsetInline string
InsetInlineEnd string
InsetInlineStart string
Interactivity string
InterestDelay string
InterestDelayEnd string
InterestDelayStart string
InterpolateSize string
Isolation string
JustifyContent string
JustifyItems string
JustifySelf string
JustifyTracks string
Left string
LetterSpacing string
LightingColor string
LineBreak string
LineClamp string
LineHeight string
LineHeightStep string
ListStyle string
ListStyleImage string
ListStylePosition string
ListStyleType string
Margin string
MarginBlock string
MarginBlockEnd string
MarginBlockStart string
MarginBottom string
MarginInline string
MarginInlineEnd string
MarginInlineStart string
MarginLeft string
MarginRight string
MarginTop string
MarginTrim string
Marker string
MarkerEnd string
MarkerMid string
MarkerStart string
Mask string
MaskBorder string
MaskBorderMode string
MaskBorderOutset string
MaskBorderRepeat string
MaskBorderSlice string
MaskBorderSource string
MaskBorderWidth string
MaskClip string
MaskComposite string
MaskImage string
MaskMode string
MaskOrigin string
MaskPosition string
MaskRepeat string
MaskSize string
MaskType string
MasonryAutoFlow string
MathDepth string
MathShift string
MathStyle string
MaxBlockSize string
MaxHeight string
MaxInlineSize string
MaxLines string
MaxWidth string
MinBlockSize string
MinHeight string
MinInlineSize string
MinWidth string
MixBlendMode string
ObjectFit string
ObjectPosition string
ObjectViewBox string
Offset string
OffsetAnchor string
OffsetDistance string
OffsetPath string
OffsetPosition string
OffsetRotate string
Opacity string
Order string
Orphans string
Outline string
OutlineColor string
OutlineOffset string
OutlineStyle string
OutlineWidth string
Overflow string
OverflowAnchor string
OverflowBlock string
OverflowClipBox string
OverflowClipMargin string
OverflowInline string
OverflowWrap string
OverflowX string
OverflowY string
Overlay string
OverscrollBehavior string
OverscrollBehaviorBlock string
OverscrollBehaviorInline string
OverscrollBehaviorX string
OverscrollBehaviorY string
Padding string
PaddingBlock string
PaddingBlockEnd string
PaddingBlockStart string
PaddingBottom string
PaddingInline string
PaddingInlineEnd string
PaddingInlineStart string
PaddingLeft string
PaddingRight string
PaddingTop string
Page string
PageBreakAfter string
PageBreakBefore string
PageBreakInside string
PaintOrder string
Perspective string
PerspectiveOrigin string
PlaceContent string
PlaceItems string
PlaceSelf string
PointerEvents string
Position string
PositionAnchor string
PositionArea string
PositionTry string
PositionTryFallbacks string
PositionTryOrder string
PositionVisibility string
PrintColorAdjust string
Quotes string
R string
ReadingFlow string
ReadingOrder string
Resize string
Right string
Rotate string
RowGap string
RubyAlign string
RubyMerge string
RubyOverhang string
RubyPosition string
Rx string
Ry string
Scale string
ScrollBehavior string
ScrollInitialTarget string
ScrollMargin string
ScrollMarginBlock string
ScrollMarginBlockEnd string
ScrollMarginBlockStart string
ScrollMarginBottom string
ScrollMarginInline string
ScrollMarginInlineEnd string
ScrollMarginInlineStart string
ScrollMarginLeft string
ScrollMarginRight string
ScrollMarginTop string
ScrollMarkerGroup string
ScrollPadding string
ScrollPaddingBlock string
ScrollPaddingBlockEnd string
ScrollPaddingBlockStart string
ScrollPaddingBottom string
ScrollPaddingInline string
ScrollPaddingInlineEnd string
ScrollPaddingInlineStart string
ScrollPaddingLeft string
ScrollPaddingRight string
ScrollPaddingTop string
ScrollSnapAlign string
ScrollSnapCoordinate string
ScrollSnapDestination string
ScrollSnapPointsX string
ScrollSnapPointsY string
ScrollSnapStop string
ScrollSnapType string
ScrollSnapTypeX string
ScrollSnapTypeY string
ScrollTargetGroup string
ScrollTimeline string
ScrollTimelineAxis string
ScrollTimelineName string
ScrollbarColor string
ScrollbarGutter string
ScrollbarWidth string
ShapeImageThreshold string
ShapeMargin string
ShapeOutside string
ShapeRendering string
SpeakAs string
StopColor string
StopOpacity string
Stroke string
StrokeColor string
StrokeDasharray string
StrokeDashoffset string
StrokeLinecap string
StrokeLinejoin string
StrokeMiterlimit string
StrokeOpacity string
StrokeWidth string
TabSize string
TableLayout string
TextAlign string
TextAlignLast string
TextAnchor string
TextAutospace string
TextBox string
TextBoxEdge string
TextBoxTrim string
TextCombineUpright string
TextDecoration string
TextDecorationColor string
TextDecorationInset string
TextDecorationLine string
TextDecorationSkip string
TextDecorationSkipInk string
TextDecorationStyle string
TextDecorationThickness string
TextEmphasis string
TextEmphasisColor string
TextEmphasisPosition string
TextEmphasisStyle string
TextIndent string
TextJustify string
TextOrientation string
TextOverflow string
TextRendering string
TextShadow string
TextSizeAdjust string
TextSpacingTrim string
TextTransform string
TextUnderlineOffset string
TextUnderlinePosition string
TextWrap string
TextWrapMode string
TextWrapStyle string
TimelineScope string
TimelineTrigger string
TimelineTriggerActivationRange string
TimelineTriggerActivationRangeEnd string
TimelineTriggerActivationRangeStart string
TimelineTriggerActiveRange string
TimelineTriggerActiveRangeEnd string
TimelineTriggerActiveRangeStart string
TimelineTriggerName string
TimelineTriggerSource string
Top string
TouchAction string
Transform string
TransformBox string
TransformOrigin string
TransformStyle string
Transition string
TransitionBehavior string
TransitionDelay string
TransitionDuration string
TransitionProperty string
TransitionTimingFunction string
Translate string
TriggerScope string
UnicodeBidi string
UserSelect string
VectorEffect string
VerticalAlign string
ViewTimeline string
ViewTimelineAxis string
ViewTimelineInset string
ViewTimelineName string
ViewTransitionClass string
ViewTransitionName string
ViewTransitionScope string
Visibility string
WhiteSpace string
WhiteSpaceCollapse string
Widows string
Width string
WillChange string
WordBreak string
WordSpacing string
WordWrap string
WritingMode string
X string
Y string
ZIndex string
Zoom string
}
Style holds every known CSS property as a typed string field. Zero-value (empty string) fields are skipped when applied via CSS().
Source Files
¶
Directories
Click to show internal directories.
Click to hide internal directories.