TerraFluent
Get started
TerraFluent.Chart.Reporting

Themes and Fills

Every chart below is the same builder call with a different theme or fill applied. Themes are a single .Theme(...) call and change nothing about your data code.

Read the reference documentation →

Dark Theme

ChartTheme.Dark — navy background, light text.

Server Throughput — Dark theme — browser / dashboard use Server Throughput — Dark theme — browser / dashboard use — Series: API, Cache. Categories: 00 to 24. Values range from 310 to 1.8k. Server Throughput Dark theme — browser / dashboard use 0 500 1k 1.5k Req/s 00 04 08 12 16 20 24 Hour API: 820 API: 430 API: 1.2k API: 1.8k API: 1.7k API: 1.1k API: 640 Cache: 600 Cache: 310 Cache: 900 Cache: 1.3k Cache: 1.2k Cache: 850 Cache: 480 API Cache terrafluent.dev terrafluent.dev

Pastel Theme

ChartTheme.Pastel — soft off-white background.

Monthly Sales — Pastel theme — soft presentation style Monthly Sales — Pastel theme — soft presentation style — Series: Product A, Product B. Categories: Jan to Jun. Values range from 290 to 600. Monthly Sales Pastel theme — soft presentation style 0 100 200 300 400 500 600 Units Jan Feb Mar Apr May Jun Product A: 420 Product A: 380 Product A: 510 Product A: 490 Product A: 560 Product A: 600 Product B: 310 Product B: 290 Product B: 370 Product B: 400 Product B: 430 Product B: 450 Product A Product B terrafluent.dev terrafluent.dev

Vivid Theme

ChartTheme.Vivid — full-spectrum palette.

Global Market Performance — ChartTheme.Vivid — full-spectrum palette Global Market Performance — ChartTheme.Vivid — full-spectrum palette — Series: Americas, Europe, Asia Pac, Trend. Categories: Q1 to Q6. Values range from 280 to 710. Global Market Performance ChartTheme.Vivid — full-spectrum palette 0 100 200 300 400 500 600 700 Revenue ($M) Q1 Q2 Q3 Q4 Q5 Q6 Americas: 420 Americas: 510 Americas: 480 Americas: 630 Americas: 590 Americas: 710 Europe: 310 Europe: 360 Europe: 400 Europe: 420 Europe: 470 Europe: 530 Asia Pac: 280 Asia Pac: 330 Asia Pac: 390 Asia Pac: 450 Asia Pac: 520 Asia Pac: 600 Trend: 337 Trend: 400 Trend: 423 Trend: 500 Trend: 527 Trend: 613 Americas Europe Asia Pac Trend terrafluent.dev terrafluent.dev

High-Contrast Theme

ChartTheme.HighContrast — WCAG AA palette, all colours ≥ 4.5:1 on white.

Quarterly Revenue — High-Contrast Theme — ChartTheme.HighContrast — WCAG AA ≥ 4.5:1 on white Quarterly Revenue — High-Contrast Theme — ChartTheme.HighContrast — WCAG AA ≥ 4.5:1 on white — Series: Product A, Product B, Target. Categories: Q1, Q2, Q3, Q4. Values range from 95 to 178. Quarterly Revenue — High-Contrast Theme ChartTheme.HighContrast — WCAG AA ≥ 4.5:1 on white 0 50 100 150 Revenue ($k) Q1 Q2 Q3 Q4 Product A: 120 Product A: 145 Product A: 132 Product A: 178 Product B: 95 Product B: 110 Product B: 128 Product B: 142 Product A Product B Target terrafluent.dev terrafluent.dev

Column — Border & Corner Radius

Series.BorderWidth · BorderRadius per column series.

Series Formatting — Border & Corner Radius — BorderWidth · BorderRadius applied independently per column series Series Formatting — Border & Corner Radius — BorderWidth · BorderRadius applied independently per column series — Series: Revenue, Cost, Profit. Categories: Q1, Q2, Q3, Q4. Values range from 110 to 480. Series Formatting — Border & Corner Radius BorderWidth · BorderRadius applied independently per column series 0 100 200 300 400 Value ($k) Q1 Q2 Q3 Q4 Revenue: 320 Revenue: 410 Revenue: 390 Revenue: 480 Cost: 210 Cost: 260 Cost: 245 Cost: 290 Profit: 110 Profit: 150 Profit: 145 Profit: 190 Revenue Cost Profit terrafluent.dev terrafluent.dev

Scatter — Marker Borders

Series.BorderWidth on scatter dot markers.

Scatter — Custom Marker Borders — Series.BorderWidth on scatter dot markers Scatter — Custom Marker Borders — Series.BorderWidth on scatter dot markers — Series: Group A, Group B. Values range from 43 to 80. Scatter — Custom Marker Borders Series.BorderWidth on scatter dot markers 30 40 50 60 70 80 90 Value Index Group A: 62 Group A: 58 Group A: 74 Group A: 55 Group A: 80 Group A: 67 Group A: 71 Group A: 59 Group A: 77 Group A: 63 Group B: 45 Group B: 52 Group B: 61 Group B: 48 Group B: 57 Group B: 70 Group B: 43 Group B: 65 Group B: 53 Group B: 68 Group A Group B terrafluent.dev terrafluent.dev

Area — Fill Opacity

Series.FillOpacity: 0.15 · 0.40 · 0.70 — three overlapping area series.

Area — Fill Opacity — Series.FillOpacity: 0.15 (Organic) · 0.40 (Direct) · 0.70 (Referral) Area — Fill Opacity — Series.FillOpacity: 0.15 (Organic) · 0.40 (Direct) · 0.70 (Referral) — Series: Organic, Direct, Referral. Categories: Jan to Dec. Values range from 400 to 2.3k. Area — Fill Opacity Series.FillOpacity: 0.15 (Organic) · 0.40 (Direct) · 0.70 (Referral) 0 500 1k 1.5k 2k Sessions Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec Month Organic: 1.2k Organic: 1.4k Organic: 1.5k Organic: 1.7k Organic: 1.9k Organic: 2.1k Organic: 2.3k Organic: 2.2k Organic: 2k Organic: 1.8k Organic: 1.6k Organic: 1.4k Direct: 800 Direct: 850 Direct: 900 Direct: 950 Direct: 1k Direct: 1.1k Direct: 1.2k Direct: 1.2k Direct: 1.1k Direct: 950 Direct: 850 Direct: 750 Referral: 400 Referral: 420 Referral: 440 Referral: 480 Referral: 520 Referral: 560 Referral: 600 Referral: 580 Referral: 540 Referral: 500 Referral: 460 Referral: 420 Organic Direct Referral terrafluent.dev terrafluent.dev

Gradient-Filled Area

LinearGradientFill() — vertical gradient via SVG <linearGradient>.

Traffic Over Time — Area filled with a vertical linear gradient Traffic Over Time — Area filled with a vertical linear gradient — Series: Visitors. Categories: Mon to Sun. Values range from 120 to 340. Traffic Over Time Area filled with a vertical linear gradient 0 50 100 150 200 250 300 Sessions Mon Tue Wed Thu Fri Sat Sun Visitors: 120 Visitors: 200 Visitors: 180 Visitors: 260 Visitors: 320 Visitors: 290 Visitors: 340 Visitors terrafluent.dev terrafluent.dev

Pattern-Filled Columns

PatternFill() — diagonal lines, dots, grid via SVG <pattern>.

Regional Output — Columns filled with SVG tile patterns Regional Output — Columns filled with SVG tile patterns — Series: Diagonal, Dots, Grid. Categories: North, South, East, West. Values range from 30 to 66. Regional Output Columns filled with SVG tile patterns 0 10 20 30 40 50 60 Units North South East West Diagonal: 42 Diagonal: 58 Diagonal: 35 Diagonal: 66 Dots: 30 Dots: 48 Dots: 52 Dots: 40 Grid: 55 Grid: 38 Grid: 44 Grid: 60 Diagonal Dots Grid terrafluent.dev terrafluent.dev

Marker Symbol Shapes

MarkerSymbol() — circle, square, diamond, and triangle.

Quarterly KPIs — Each series uses a distinct marker symbol Quarterly KPIs — Each series uses a distinct marker symbol — Series: Circle, Square, Diamond, Triangle. Categories: Q1, Q2, Q3, Q4. Values range from 20 to 58. Quarterly KPIs Each series uses a distinct marker symbol 0 10 20 30 40 50 Index Q1 Q2 Q3 Q4 Circle: 20 Circle: 34 Circle: 30 Circle: 46 Square: 30 Square: 26 Square: 42 Square: 38 Diamond: 40 Diamond: 48 Diamond: 36 Diamond: 54 Triangle: 52 Triangle: 44 Triangle: 58 Triangle: 50 Circle Square Diamond Triangle terrafluent.dev terrafluent.dev

Keep going

All chart types and features The full gallery index — 26 chart types, eight feature groups, and the cookbook. Getting started Install the package and render your first chart in a few lines of C#. API reference Every builder method, series type, enum and theme in one page.

← Back to the full chart gallery