Skip to content
Switch branches/tags
Go to file
Cannot retrieve contributors at this time
<!doctype html>
<html class="no-js" lang="en">
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Just Enough SVG</title>
<link rel="stylesheet" href="css/foundation.css" />
<script src="js/vendor/modernizr.js"></script>
<style type="text/css">
svg {
opacity: 0.75;
svg text {
font-size: 1.75em;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
<nav class="top-bar" data-topbar>
<ul class="title-area">
<li class="name">
<h1><a href="#">D3 Demos</a></h1>
<div class="row">
<div class="large-12 columns">
<h1>Just Enough SVG</h1>
<div class="row">
<div class="large-8 columns">
<p>Some quick examples of SVG.</p>
<div class="row">
<div class="large-3 columns">
<svg width="120" height="120" xmlns="">
<circle cx="60" cy="60" r="50" />
<div class="large-4 columns">
<svg width="100%" height="200" xmlns="">
<rect x="5%" y="5" width="20%" height="30%" class="bar" />
<rect x="22%" y="5" width="20%" height="50%" class="bar" />
<rect x="39%" y="5" width="20%" height="75%" class="bar" />
<div class="large-3 columns end">
<svg width="100%" height="100" xmlns="">
<text x="5" y="50">
Howdy Campers!
<script src="js/vendor/jquery.js"></script>
<script src="js/foundation.min.js"></script>