Visual-Design Language

YOUNA GFX — our own visual-design language

What CSS should have been: a language that describes whole scenes, not documents.

Describing scenes, not documents

YOUNA GFX is our second in-house language — also designed and authored by our founder, Muhammad Basharat. Where CSS styles documents, a .gfx file describes an entire visual world: multi-layered 2D compositions, real 3D scenes with meshes, materials, lights and shadows, geographic maps and keyframe animation — all in one readable declarative syntax, compiled and rendered by a single engine we wrote ourselves, with zero dependencies.

The long-term goal is a unified design platform: easier than CSS for beginners, deeper than any styling language for professionals — with an editor, optimizer and portable export, all synchronized with the same language.

One paint model, everywhere

GFX has a single procedural paint system — solid, linear and radial gradients, conic sweeps, checker, stripes and noise — that fills 2D shapes and texture-maps 3D surfaces through mesh UVs, so patterns stick to objects rather than the screen. Layers composite with real blend modes, opacity, shadows and transforms, exactly like a professional compositor.

Real 3D, not a trick

A world block contains a full 3D scene rendered by our own CPU rasterizer with z-buffering and perspective-correct interpolation:

  • Built-in meshes plus glTF model import (and spec-valid .glb export)
  • PBR-style materials — albedo, metal, roughness, emissive, smooth or flat shading
  • Ambient, directional, point and spot lights — with real shadow maps (ortho, perspective cone and cube-map depth passes)
  • Distance fog, per-pixel Blinn-Phong shading, and 17 post-effects — bloom, vignette, chromatic aberration, scanlines, grain, exposure, curves and more

Maps and data built into the language

A map layer projects real longitude/latitude features — markers, routes, regions, labels, graticule and great-circle arcs — through equirectangular, Mercator or ortho projections (ortho renders a spinning globe). Procedural terrain with hillshading, 2.5D region extrusion and haversine distance functions are built in, and data blocks bind CSV or GeoJSON files straight into the visuals: one marker per row, values remapped through lin and ramp, filtered with where. Bar charts, scatters and dashboards are native language constructs.

Animation, typography and formats

  • One animation model — keyframes, easing, loop and ping-pong on any animatable property, including cameras, lights and map features
  • Motion paths — shapes ride waypoint polylines at constant arc-length speed; textpath lays text along a curve
  • Real fonts — TrueType, OpenType CFF and WOFF glyph outlines with GSUB ligatures and GPOS kerning — text is shaped, not just drawn
  • Hand-written codecs — PNG, JPEG (baseline and progressive), BMP and GIF decode; PNG, APNG, animated GIF, SVG, GLB, HTML player and AVI/MJPEG video export

GFX Studio — a live visual editor

The language ships with GFX Studio: a zero-dependency live editor with a source pane, rendered preview, timeline scrubber, scene-tree inspector with two-way editing, pixel-accurate click-to-select (including 3D objects and map features), drag-to-move/scale/rotate handles, undo/redo and one-click GIF export — every change written back into the real .gfx source.

Part of a bigger ecosystem

GFX is a companion to our other foundations: rendered frames feed directly into YOUNA Teleport, our own video codec and format, and it sits alongside YOUNA (the universal language), YounaCoin (our blockchain) and YOU (our operating system) in the Younasoft ecosystem.

See the whole ecosystem at younasoft.com, or read about the sister language in YOUNA — our own programming language.

← Back to all posts