Add shared CSS guidance for HTML visualizations (#3742)

* Add shared CSS guidance for HTML visualizations

Add info box explaining how to use shared CSS files for consistent
styling across multiple HTML visualizations in ZenML pipelines.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>

* Fix broken link

---------

Co-authored-by: Claude <[email protected]>

Author: strickvl

docs/book/getting-started/zenml-pro/self-hosted.md

@@ -590,7 +590,7 @@ The above are infrastructure requirements for ZenML Pro. If, in addition to ZenM
 * [a Kubernetes ZenML Orchestrator](https://docs.zenml.io/stacks/orchestrators/kubernetes) can be set up to run on the same cluster as ZenML Pro. For authentication, you will be able to configure [a ZenML Kubernetes Service Connector using service account tokens](https://docs.zenml.io/how-to/infrastructure-deployment/auth-management/kubernetes-service-connector)
 * you'll need a container registry to store the container images built by ZenML. If you don't have one already, you can install [Docker registry](https://github.com/twuni/docker-registry.helm) on the same cluster as ZenML Pro.
 * you'll also need some form of centralized object storage to store the artifacts generated by ZenML. If you don't have one already, you can install [MinIO](https://artifacthub.io/packages/helm/bitnami/minio) on the same cluster as ZenML Pro and then configure the [ZenML S3 Artifact Store](https://docs.zenml.io/stacks/artifact-stores/s3) to use it.
-* (optional) you can install [Kaniko](https://bitnami.com/stack/kaniko) in your Kubernetes cluster to build the container images for your ZenML pipelines and then configure it as a [ZenML Kaniko Image Builder](https://docs.zenml.io/stacks/image-builders/kaniko) in your ZenML Stack.
+* (optional) you can install [Kaniko](https://github.com/GoogleContainerTools/kaniko) in your Kubernetes cluster to build the container images for your ZenML pipelines and then configure it as a [ZenML Kaniko Image Builder](https://docs.zenml.io/stacks/image-builders/kaniko) in your ZenML Stack.
 
 ## Stage 1/2: Install the ZenML Pro Control Plane
 

docs/book/how-to/artifacts/visualizations.md

@@ -90,6 +90,14 @@ This would create the following visualization in the dashboard:
 
 ![CSV Visualization Example](../../.gitbook/assets/artifact_visualization_csv.png)
 
+{% hint style="info" %}
+**Shared CSS for Consistent Visualizations**
+
+When creating multiple HTML visualizations across your pipeline, consider using a shared CSS file to maintain consistent styling. Create a central CSS file with your design system (colors, components, layouts) and Python utilities to load it into your HTML templates. This approach eliminates code duplication, ensures visual consistency across all reports, and makes it easy to update styling across all visualizations from a single location.
+
+You can create helper functions that return complete HTML templates with shared styles, and use CSS variables for theme management. This pattern is especially valuable for teams generating multiple HTML reports or dashboards where maintaining a professional, cohesive appearance is important.
+{% endhint %}
+
 Another example is visualizing a matplotlib plot by embedding the image in an HTML string:
 
 ```python