Triangles
Triangles is an abstract vector avatar style that tiles a grid of two-tone triangles into a tangram-like pattern across a colored background. Generate graphic, distinctive SVG profile icons that work as avatar placeholders or decorative user identifiers.
Preview
Usage
Use this URL to request this avatar style via our HTTP API.
https://api.dicebear.com/10.x/triangles/svgYou can use the URL directly as image source.
<img
src="https://api.dicebear.com/10.x/triangles/svg"
alt="avatar"
/>See HTTP-API docs for more information.
First install the required packages via npm:
npm install @dicebear/core @dicebear/styles --saveThen you can create this avatar as follows:
import { Style, Avatar } from '@dicebear/core';
import definition from '@dicebear/styles/triangles.json' with { type: 'json' };
const style = new Style(definition);
const avatar = new Avatar(style, {
// ... options
});
const svg = avatar.toString();
See JS docs for more information.
First install the required packages via Composer:
composer require dicebear/core dicebear/stylesThen you can create this avatar as follows:
<?php
use Composer\InstalledVersions;
use DiceBear\Style;
use DiceBear\Avatar;
$basePath = InstalledVersions::getInstallPath('dicebear/styles');
$definition = json_decode(file_get_contents($basePath . '/src/triangles.json'), true);
$style = new Style($definition);
$avatar = new Avatar($style, [
// ... options
]);
$svg = (string) $avatar;
See PHP docs for more information.
First install the required packages via pip:
pip install dicebear-core dicebear-stylesThen you can create this avatar as follows:
import json
from importlib.resources import files
from dicebear import Avatar, Style
definition = json.loads(
files("dicebear_styles").joinpath("triangles.json").read_text("utf-8")
)
style = Style(definition)
avatar = Avatar(style, {
# ... options
})
svg = avatar.to_string()
See Python docs for more information.
First install the CLI package via npm:
npm install --global dicebearThen you can create this avatar as follows:
dicebear trianglesSee CLI docs for more information.
Options
Details
Naming
| Definition Import | |
| CLI | |
| HTTP-API | https://api.dicebear.com/10.x/triangles/svg |
| Definition | https://cdn.hopjs.net/npm/@dicebear/styles@10.1.0/dist/triangles.min.json |
Source
| Title | Triangles |
| Creator | DiceBear |
| Website | https://www.dicebear.com |
| License | CC0 1.0 |
| Source | https://www.dicebear.com |