gentleface

Gentleface › Development › schema

schema icon

Schema: database schema, data model, erd, entity relationship diagram. Drawn on the 16 px grid. Free SVG, PNG and code, MIT licensed.

SVGPNG 16PNG 32PNG 48

SVGPNG 16PNG 32PNG 48

SVGPNG 16PNG 32PNG 48

SVGPNG 16PNG 32PNG 48

SVGPNG 16PNG 32PNG 48

SVGPNG 16PNG 32PNG 48

Code line-round

SVG
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M10.293 1.293C10.488 1.098 10.724 1 11 1L14 1C14.276 1 14.512 1.098 14.707 1.293C14.902 1.488 15 1.724 15 2L15 6C15 6.276 14.902 6.512 14.707 6.707C14.512 6.902 14.276 7 14 7L11 7C10.724 7 10.488 6.902 10.293 6.707C10.098 6.512 10 6.276 10 6L10 5L6 5L6 6C6 6.276 5.902 6.512 5.707 6.707C5.512 6.902 5.276 7 5 7L4 7L4 9L5 9C5.276 9 5.512 9.098 5.707 9.293C5.902 9.488 6 9.724 6 10L6 14C6 14.276 5.902 14.512 5.707 14.707C5.512 14.902 5.276 15 5 15L2 15C1.724 15 1.488 14.902 1.293 14.707C1.098 14.512 1 14.276 1 14L1 10C1 9.724 1.098 9.488 1.293 9.293C1.488 9.098 1.724 9 2 9L3 9L3 7L2 7C1.724 7 1.488 6.902 1.293 6.707C1.098 6.512 1 6.276 1 6L1 2C1 1.724 1.098 1.488 1.293 1.293C1.488 1.098 1.724 1 2 1L5 1C5.276 1 5.512 1.098 5.707 1.293C5.902 1.488 6 1.724 6 2L6 4L10 4L10 2C10 1.724 10.098 1.488 10.293 1.293ZM5 3L5 2L2 2L2 3L5 3ZM11 3L14 3L14 2L11 2L11 3ZM5 6L5 4L2 4L2 6L5 6ZM14 6L14 4L11 4L11 6L14 6ZM5 11L5 10L2 10L2 11L5 11ZM5 14L5 12L2 12L2 14L5 14Z"/></svg>
React
// Gentleface "schema" (line-round), MIT. https://gentleface.com/icons/schema
import type { SVGProps } from 'react';

export function SchemaIcon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg xmlns="http://www.w3.org/2000/svg" width={16} height={16} viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" {...props}>
      <path d="M10.293 1.293C10.488 1.098 10.724 1 11 1L14 1C14.276 1 14.512 1.098 14.707 1.293C14.902 1.488 15 1.724 15 2L15 6C15 6.276 14.902 6.512 14.707 6.707C14.512 6.902 14.276 7 14 7L11 7C10.724 7 10.488 6.902 10.293 6.707C10.098 6.512 10 6.276 10 6L10 5L6 5L6 6C6 6.276 5.902 6.512 5.707 6.707C5.512 6.902 5.276 7 5 7L4 7L4 9L5 9C5.276 9 5.512 9.098 5.707 9.293C5.902 9.488 6 9.724 6 10L6 14C6 14.276 5.902 14.512 5.707 14.707C5.512 14.902 5.276 15 5 15L2 15C1.724 15 1.488 14.902 1.293 14.707C1.098 14.512 1 14.276 1 14L1 10C1 9.724 1.098 9.488 1.293 9.293C1.488 9.098 1.724 9 2 9L3 9L3 7L2 7C1.724 7 1.488 6.902 1.293 6.707C1.098 6.512 1 6.276 1 6L1 2C1 1.724 1.098 1.488 1.293 1.293C1.488 1.098 1.724 1 2 1L5 1C5.276 1 5.512 1.098 5.707 1.293C5.902 1.488 6 1.724 6 2L6 4L10 4L10 2C10 1.724 10.098 1.488 10.293 1.293ZM5 3L5 2L2 2L2 3L5 3ZM11 3L14 3L14 2L11 2L11 3ZM5 6L5 4L2 4L2 6L5 6ZM14 6L14 4L11 4L11 6L14 6ZM5 11L5 10L2 10L2 11L5 11ZM5 14L5 12L2 12L2 14L5 14Z" />
    </svg>
  );
}
Vue
Vue: see /icons/schema.md
Svelte
Svelte: see /icons/schema.md
HTML img
HTML img: see /icons/schema.md
CSS
CSS: see /icons/schema.md
Data URL
Data URL: see /icons/schema.md
Sprite
Sprite: see /icons/schema.md
SwiftUI
SwiftUI: see /icons/schema.md
Compose
Compose: see /icons/schema.md
Android XML
Android XML: see /icons/schema.md
Flutter
Flutter: see /icons/schema.md

Each SVG is 16 × 16 with fill="currentColor". Keep it at 16 px or an exact multiple (32, 48) on whole pixels: a fractional size or position blurs it. The snippets are decorative (aria-hidden). For an icon that carries meaning on its own, such as an icon-only button, label the button, or give the SVG role="img" and an aria-label. More in how to use.

With npm: import { SchemaIcon } from '@gentleface/react'; (setup).

Meaning

Use it for
database schema, data model, erd, entity relationship diagram
Alternatives
  • database: the database itself (database)
  • table: a single table (data-table)
Tags
schema, database-schema, data-model, erd, entity-relationship, tables, relations, foreign-key, diagram, structure, model, blueprint
Category
Development
Component name
SchemaIcon
History
  • released in 0.2.0
  • added
Since
version 0.2.0

More development icons

api api-letters binary braces brackets bug bug-off bug-play code code-alert code-block code-eye code-off code-pencil code-play code-search · all development icons

For agents

Metadata: /icons/schema.json · Markdown: /icons/schema.md · SVG: https://gentleface.com/svg/{style}/16/schema.svg · PNG: https://gentleface.com/png/{style}/{16|32|48}/schema.png