Skip to content
Dashboard framework for Dash.
Python CSS
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.


Finish Line

Finish Line is a framework for quickly building beautiful customizable dashboards in Plotly Dash. The framework provides utility for developers to easily plugin new interactive visualization components into the dashboard. Components are automatically added to the dashboard using a responsive grid layout.

How to use Finish Line

An example use of the framework is located in the GitHub repo under the example directory. The following shows the minimum code required to start a Finish Line dashboard server.

from finishline import FinishLine
import dash

app = dash.Dash()
data = load_my_data()

fl = FinishLine(app=app, data=data)
app.layout = fl.generate_layout()

if __name__ == '__main__':
    fl.run_server(debug=True, port=5000, host='')

Visualization components are loaded from the plugins folder. The default location is in a folder called plugins in the current working directory (directory the web server is started). Individual plugins are located in subfolders under the plugins folder. The entry point to a plugin is in the file

Here is an example component. The code is placed in ./plugins/HelloWorld/

import dash_html_components as html
import dash_core_components as dcc

def initialize(app, data, fl):

                'data': [
                        'x': [1, 2, 3, 4],
                        'y': [4, 1, 3, 5],
                        'text': ['a', 'b', 'c', 'd'],
                        'customdata': ['c.a', 'c.b', 'c.c', 'c.d'],
                        'name': 'Trace 1',
                        'mode': 'markers',
                        'marker': {'size': 12}
                        'x': [1, 2, 3, 4],
                        'y': [9, 4, 1, 4],
                        'text': ['w', 'x', 'y', 'z'],
                        'customdata': ['c.w', 'c.x', 'c.y', 'c.z'],
                        'name': 'Trace 2',
                        'mode': 'markers',
                        'marker': {'size': 12}
                'autosizable': True

def finalize(app, data, fl):


Finish Line depends upon dash. Note, we have only tested with python3.


  • dash
  • dash-responsive-grid-layout

Install Options

pip3 install finishline


Create distribution

  • edit and change version number
python3 sdist bdist_wheel

Install distribution locally

pip3 uninstall finishline
pip3 install dist/finishline-VERSION-py3-none-any.whl

Push to test pip

twine upload --repository-url dist/*VERSION*
pip3 install -U --index-url finishline

Push to production pip

twine upload dist/*VERSION*
pip3 install -U finishline


  • Client and server side data store API
  • Plugin visualization component API
  • Responsive grid layout
  • Customizable grid layout via drag and drop
  • Developer mode

To Do List

  • Save layout
  • Reusable components API
  • Hide/Show components
  • Support multiple pages
  • Better support for resizing plotly charts
You can’t perform that action at this time.