-
-
Notifications
You must be signed in to change notification settings - Fork 569
CSS Style
.terminal {
--color: green;
--background: white;
--link-color: darkblue;
}
.terminal {
--size: 1.5;
}
You can change the size depending on the size of the terminal (browser window) using media queries.
.cmd-cursor {
--original-color: white;
}
Check this Codepen demo to see the styling of a different parts of the terminal.
From version 2.29.0 there is css variable that can be easily used to enable glow effect:
.terminal {
--color: rgba(0, 200, 0, 0.99);
--animation: terminal-glow;
--glow: 1;
}
From version 2.31.0 you don't need to change animation to have glow on the cursor.
See Glow Demo
You can use custom properties on a single piece of text that you render using echo.
See Attribute Formatter.
You can use CSS transform to fit the terminal into any image. An example image of a computer or laptop. Here is a demo that shows how to calculate the matrix needed for transformation.
Library for Web-Based Terminal in JavaScript, (jQuery Terminal: git repo)
Copyright (c) 2011-2023 Jakub T. Jankiewicz