Static text style

It's the most basic text style, so you can use it for simple static text

Demo:

001 style schema

This is a simplified schema of a 001 style element:

{
    "type": "text",
    "style": "001",
    "text": "",
    "settings": {}
}

Check the full specification of the Style schema in the API documentation.

Settings property for 001

This text style has the following default properties in the settings field:

Object property

Default value

font-size

"4vw"

font-family

"Inter"

font-weight

"700"

text-align

"center"

vertical-align

"center"

text-shadow

"2px 2px rgba(33,33,33,0.5)"

color

"#FFFFFF"

Usage examples

Check the following examples of 001:

{
    "resolution": "full-hd",
    "quality": "high",
    "draft": false,
    "scenes": [
        {
            "background-color": "#4392F1",
            "elements": [
                {
                    "type": "text",
                    "text": "Hello world",
                    "duration": 5
                }
            ]
        }
    ]
}

require 'vendor/autoload.php';

use JSON2Video\Movie;
use JSON2Video\Scene;

// Create and initialize the movie object
$movie = new Movie;
$movie->setAPIKey(YOUR_API_KEY);
$movie->resolution = 'full-hd';
$movie->quality = 'high';
$movie->draft = false;

// Create the scenes of the movie

// Create SCENE 1
$scene1 = new Scene;
$scene1->background-color = '#4392F1';
$scene1->addElement([
'text',
'Hello world',
5
]);
$movie->addScene($scene1);

// Finally, render the movie
$movie->render();

// Wait for the movie to be rendered
$movie->waitToFinish();

let movie = new Movie;
movie.setAPIKey(YOUR_API_KEY);
movie.set("resolution", "full-hd");
movie.set("quality", "high");
movie.set("draft", false);

// Create the scenes of the movie

// Create SCENE 1
let scene1 = new Scene;
scene1.set("background-color", "#4392F1");
scene1.addElement([
"text",
"Hello world",
5
]);
movie.addScene(scene1);

// Finally, render the movie
movie.render();

// Wait for the movie to be rendered
movie.waitToFinish();

Example 2

JSON
PHP
NodeJS

{
    "resolution": "full-hd",
    "quality": "high",
    "draft": false,
    "scenes": [
        {
            "elements": [
                {
                    "type": "video",
                    "src": "https://assets.json2video.com/assets/videos/beach-01.mp4"
                },
                {
                    "type": "text",
                    "style": "001",
                    "text": "'Lorem ipsum' has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book",
                    "settings": {
                        "color": "#FFFFFF",
                        "font-size": "60px",
                        "font-family": "Roboto Condensed",
                        "shadow": 2,
                        "text-align": "left",
                        "vertical-align": "top"
                    },
                    "width": 960,
                    "x": 900,
                    "y": 50
                }
            ]
        }
    ]
}

require 'vendor/autoload.php';

use JSON2Video\Movie;
use JSON2Video\Scene;

// Create and initialize the movie object
$movie = new Movie;
$movie->setAPIKey(YOUR_API_KEY);
$movie->resolution = 'full-hd';
$movie->quality = 'high';
$movie->draft = false;

// Create the scenes of the movie

// Create SCENE 1
$scene1 = new Scene;
$scene1->addElement([
'video',
'https://assets.json2video.com/assets/videos/beach-01.mp4'
]);
$scene1->addElement([
'text',
'001',
'\'Lorem ipsum\' has been the industry\'s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book',
	[
'#FFFFFF',
'60px',
'Roboto Condensed',
2,
'left',
'top'
	],
960,
900,
50
]);
$movie->addScene($scene1);

// Finally, render the movie
$movie->render();

// Wait for the movie to be rendered
$movie->waitToFinish();

let movie = new Movie;
movie.setAPIKey(YOUR_API_KEY);
movie.set("resolution", "full-hd");
movie.set("quality", "high");
movie.set("draft", false);

// Create the scenes of the movie

// Create SCENE 1
let scene1 = new Scene;
scene1.addElement([
"video",
"https://assets.json2video.com/assets/videos/beach-01.mp4"
]);
scene1.addElement([
"text",
"001",
"'Lorem ipsum' has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book",
	[
"#FFFFFF",
"60px",
"Roboto Condensed",
2,
"left",
"top"
	],
960,
900,
50
]);
movie.addScene(scene1);

// Finally, render the movie
movie.render();

// Wait for the movie to be rendered
movie.waitToFinish();

Static text style

← Documentation

Text styles

Component packs

Static text style

001 style schema

Settings property for 001

Usage examples

Example 1

Example 2