Designer, Artist, Researcher, Educator @sugi2000lab .
co-translator for Japanese edition of “Generative Design” and “Code as Creative Medium”.
Public
Edited
Apr 15
Importers
linkButton = (label, url, backgroundColor = "#12e") => {
const id = DOM.uid("button");
return md`
<a href="${url}" target="_blank">
<button type="button" class='link-button' id='${id.id}'>${label}</button>
</a><br/>
<small class="url"><a href="${url}" target="_blank">${url}</a></small>
<style>
#${id.id} {
background: ${backgroundColor};
}
.link-button {
cursor: pointer;
padding: .5em;
font-size: 1em;
font-weight: 700;
color: #fffd;
border: none;
border-radius: .25em;
opacity: 0.8;
}
.link-button:hover {
opacity: 1;
}
.url {
font-family: monospace;
}
</style>`;
}
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
