A collection of SVG assets and design tokens for the KIParla research project — a corpus of spoken Italian. The kit provides visual building blocks for presentations, publications, and interfaces related to the project.
All assets are in assets/, organized by category. Most icons come in two color variants: red (brand color, #E52424) and white (for use on dark backgrounds).
Human figure illustrations representing corpus participants and spoken contributions.
adult-speaker.svg,young-speaker.svg,old-speaker.svg— silhouettes by age groupgeneric-contribution.svg— abstract representation of a spoken contributionquestion.svg— question mark illustration
Icons representing conversation contexts and registers.
dinner— informal dinner settingexam— exam or evaluation contextformal/informal— register markersinterview— interview contextlecture— academic lecture
Each icon is available in -red and -white variants.
Geographic and spatial icons.
italy/italy-question— Italian territory outline, plain and with question mark overlayinside/outside— private vs public setting markers
Each icon is available in -red and -white variants.
Reusable layout and background components.
background/layout-1/layout-2/layout-3— card layout templates
Each layout is available in a standard and -inverted variant (red background, white accents).
The style/ folder contains a design system for consistent visual styling across all KIParla materials.
| File | Description |
|---|---|
style/tokens.json |
Design tokens in JSON (colors, typography, spacing) |
style/tokens.css |
Same tokens as CSS custom properties, ready to import |
style/colors.md |
Color palette documentation with usage notes |
style/palette.html |
Visual preview of the color palette |
The primary brand color is red #E52424. Typography is based on Lato (SIL Open Font License).
Import style/tokens.css into your project to use the design tokens:
@import url('path/to/style/tokens.css');
.my-element {
color: var(--color-primary-500);
font-family: var(--font-family-base);
padding: var(--spacing-md);
}SVG assets can be used inline or as <img> tags. For color customization, inline SVGs support CSS targeting via class names.
Released under CC BY-NC-SA 4.0 — free for personal and research use, with attribution. Commercial use is not permitted. Derivatives must use the same license.
Developed as part of the KIParla research initiative by @iacovfn-cpu. Contributions via issues and pull requests are welcome.