About this Project

The Gradient Graphs generative art algorithm, written by Brittni Watkins. Originally published on May 8, 2022.

Description

A Gabriel Graph is a special kind of graph in graph theory where an edge can only be formed between two nodes if the circle formed by those two nodes contains no other nodes in the graph. A Random Geometric Graph is a graph where an edge can only be formed between two nodes if they are less than a certain distance away from each other. In this project, I have created random Gabriel Graphs and Random Geometric Graphs, where the graphs have a random number of nodes and each node has a random position. Each node is assigned a color, and each edge is colored according to the two nodes at each end, with a gradient line and a gradient circle which slowly transitions from one color to the other. Users can interact with the project to remove the nodes, edge lines, or edge circles, choosing how they would like the graph to be displayed.

Made with p5.js

Instructions

  • Press ‘a’ to toggle the edge circles on and off.
  • Press ‘s’ to toggle the edge lines on and off.
  • Press ‘d’ to toggle the nodes on and off.

Run Gradient Graphs

Timeline

  • February 12, 2022: Brittni begins work on a new generative color system using Java and Processing.
  • February 13, 2022: Brittni begins work on her generative art system: a collection of pseudo-random number functions and generative color factories written in JavaScript with p5.js.
  • February 20, 2022: Brittni begins work on the Growing Graphs Processing sketch.
  • March 29, 2022: Brittni begins work on the Gradient Graphs algorithm using p5.js and JavaScript.
  • May 8, 2022: Brittni publishes the Gradient Graphs p5.js sketch as a Generative Token on fx(hash).
  • August 13, 2026: Brittni begins work on version 2.0 of the Gradient Graphs algorithm.

Roadmap

Licenses

Source Code License

The source code of this project is licensed under the GNU Affero General Public License v3.0. No later version applies unless explicitly granted. The full text of the license is included with the project source code.

Generated Output License

All images, videos, prints, and other artifacts generated by this code are Copyright © 2022-2026 Brittni Watkins. All rights reserved.

Project Status Badges

GitHub

GitHub License GitHub Dependabot GitHub Last Commit GitHub Commits GitHub Commit Activity GitHub Code Size in Bytes GitHub Repo Size GitHub Repo File or Directory Count GitHub Language Count

GitHub Actions

CodeQL npm Validate Deploy GitHub Pages with Jekyll

Sources and Technical Notes

Thank Yous

A huge thank you to all the open source contributors who have made this project possible by creating and maintaining the libraries and tools used in this project, and to the open source community for fostering collaboration and innovation.

A special thank you to all the educators, mentors, and content creators who have shared their knowledge and expertise in the fields of algorithmic art, web development, and computer science. Thank you for giving me the tools, resources, opportunities, support, and inspiration to learn and grow as a developer.

An extra thank you to The Processing Foundation and all the developers and contributors who have made Processing and p5.js what they are today. This project would not exist without you.