The Visual Framework

Good defaults for life science websites, plus compatibility with existing CSS and JS. Bring your Bootsrap, Angular or vanilla CSS code base.

Learn more

Install, build

Install the source Sass and JavaScript files via yarn

# Bare bones components
yarn add @visual-framework/vf-sass-config @visual-framework/vf-inlay

# Or a boilerplate that will build your CSS and JS
yarn create @visual-framework/vf-project your-new-site-name vf-build-boilerplate

# Or a full 11ty-based site
yarn create @visual-framework/vf-project your-new-site-name

Learn more about these templates and other options


Prebuilt CDN

When you only need to include compiled CSS or JS, you can use the CDN.

See it in action with our simple starter template, or browse the examples to jumpstart your next project.

<!-- CSS only -->
<link rel="stylesheet" href="https://assets.emblstatic.net/vf/v2.3.1-rc.1/css/styles.css">
<!-- JS -->
<script src="https://assets.emblstatic.net/vf/v2.3.1-rc.1/scripts/scripts.js"></script>

Sections

Building a site

Building a site

The when and how to making a project powered with Visual Framework components.