Visualization
Components for visualizing tensors, attention patterns, and model outputs.
TensorViewer
Display 1D-4D tensors as heatmaps with customizable color scales
AttentionViewer
Visualize transformer attention patterns with multi-head support
EmbeddingViewer
Interactive 2D scatter plot for embedding visualization
TokenViewer
Display tokens with color-coded importance scores
HeatmapOverlay
Overlay heatmaps on images for saliency visualization
SoftmaxHeatmap
Visualize softmax probability distributions
Training & Monitoring
Components for monitoring model training in real-time.
TrainingStats
Display training metrics like loss, accuracy, and progress
TrainingControls
Start, pause, and stop training with intuitive controls
MetricChart
Plot multiple metrics over epochs with line charts
LogTerminal
Display training logs with color-coded severity levels
DatasetProgress
Show dataset processing progress with file info
EnergyPlot
Visualize energy/loss landscape during optimization
Analysis
Components for evaluating and analyzing model performance.
ConfusionMatrix
Display classification results with optional normalization
FeatureImportance
Bar chart showing feature importance scores
GradientFlow
Visualize gradient magnitudes through network layers
ROCCurve
Plot ROC curves for binary classification evaluation
PRCurve
Precision-Recall curves for imbalanced datasets
PredictionDisplay
Show model predictions with probability bars
WeightHistogram
Histogram of weight distributions in layers
ModelSummary
Display model architecture with layer details
ScatterPlot
2D scatter plots for data exploration
Parameters & Input
Components for collecting user input and configuring parameters.
ParamSlider
Adjustable slider for numeric parameters
ParamSelect
Dropdown selector for categorical options
ParamCheckbox
Toggle checkbox for boolean parameters
ParamInput
Text/number input for arbitrary values
ImageInput
Image upload with preview and preprocessing
TextInput
Text input for prompts and queries
FileUpload
Drag-and-drop file upload component
FileDownload
Download button for model files
Charts & Plots
Components for data visualization and plotting.
FunctionPlot
Plot mathematical functions with customizable ranges
Waveform
Display audio waveforms and time series
SequenceTimeline
Timeline view for sequential events
Audio
Components for audio playback and recording.
AudioPlayer
Audio playback with waveform visualization
AudioRecorder
Record audio with live waveform display
Model I/O
Components for saving and loading models.
ModelActions
Save and load model buttons with file handling
ImageEditor
Draw or upload images for model input
TorchEmbed
Embeddable container for torch.js demos
Network & Graph
Components for visualizing network architectures and graphs.
FlowGraph
Directed flow graph for pipeline visualization
NetworkGraph
Force-directed graph for network visualization
UI Components
General-purpose UI components for ML applications.
ChatHistory
Display chat conversations with user/assistant roles
ActionBar
Toolbar with action buttons
ImageCompare
Side-by-side image comparison slider
AnimatedGrid
Animated grid for loading and transitions
ImageGrid
Grid layout for displaying multiple images
GPU-Accelerated
High-performance components that render directly from GPU memory. These require WebGPU support.
Checking WebGPU support...
GPUHeatmap
Zero-copy heatmap rendering from WebGPU tensors
Checking WebGPU support...
GPUPointCloud
Interactive 3D point cloud with millions of points
Checking WebGPU support...
GPUTrainingDashboard
Multi-panel real-time training visualization
Checking WebGPU support...
GPUStreamingChart
High-performance streaming line charts
Checking WebGPU support...
GPUHistogram
GPU-accelerated histogram rendering
Checking WebGPU support...
GPUConfusionMatrix
GPU-rendered confusion matrix for large class counts
Checking WebGPU support...
GPUAttentionFlow
GPU-accelerated attention flow visualization
Checking WebGPU support...
GPUGradientFlow
GPU-rendered gradient flow through layers
Checking WebGPU support...
GPUSaliencyMap
GPU-accelerated saliency map overlay
Checking WebGPU support...
GPUKernelGrid
Visualize convolution kernels from GPU
Checking WebGPU support...
GPUEmbedding
GPU-accelerated embedding visualization
Checking WebGPU support...
GPURocPrCurve
GPU-rendered ROC and PR curves
Checking WebGPU support...
GPUModelArchitecture
GPU-rendered model architecture diagram
All Components
For a complete interactive experience with all component variants and live code examples, visit our Storybook:
Browse all components at ui.torchjs.org
