Components / Design System

Logo

Colors

Palette

Typography

Display

Numeric (experimenting)

Mono

H1

Almost before we knew it, we had left the ground.

H2

Almost before we knew it, we had left the ground.

H3

Almost before we knew it, we had left the ground.

H4

Almost before we knew it, we had left the ground.

Text size 7

Almost before we knew it, we had left the ground.

Text size 6

Almost before we knew it, we had left the ground.

Text size 5

Almost before we knew it, we had left the ground.

Text size 4

Almost before we knew it, we had left the ground.

Text size 3

Almost before we knew it, we had left the ground.

Text size 2

Almost before we knew it, we had left the ground.

Text size 1

Almost before we knew it, we had left the ground.

Text gradient

Almost before we knew it, we had left the ground.

Strong

EM

BigNum (WIP)

BigNum Outline (Experimenting)

Icons

Shadows

Lists

Buttons

Anchor

Form Components

Card

Tooltip

Pill

Callout

Almost before we knew it, we had left the ground.

Inline Code

Code Block

Basic

1
console.log("hello world")
2

3
/**
4
 * Some comments
5
 */
6
function sayHi(name) {
7
    var message = `hi ${name}`
8
    return message;
9
}

With title and highlighting

1
console.log("hello world")
2

3
/**
4
 * Some comments
5
 */
6
function sayHi(name) {
7
    var message = `hi ${name}`
8
    return message;
9
}

Sandpack Code Block

import { motion } from 'framer-motion';
import './scene.css';

const WavingHand = () => {
  console.log('hello world');

  return (
    <motion.div
      style={{
        marginBottom: '-20px',
        marginRight: '-45px',
        paddingBottom: '20px',
        paddingRight: '45px',
        display: 'inline-block',
      }}
      animate={{ rotate: 20 }}
      transition={{
        yoyo: Infinity,
        from: 0,
        duration: 0.2,
        ease: 'easeInOut',
        type: 'tween',
      }}
    >
      👋
    </motion.div>
  );
};

const Hi = () => (
  <h1>
    Hi <WavingHand /> !
  </h1>
);

export default Hi;

Details/Summary

Command Center / Search

Tweet

Thomas Pesquet@Thom_astro

24h dans le volume d'une Fiat 500 avec trois amis et pourtant on se sent comme chez soi... à 400 km d'altitude ! Superbe performance technique et opérationelle de toutes les équipes qui nous ont entrainés et encadrés pour ce voyage 👏 https://t.co/kreeGnnLUM

5:45 PM - Apr 24, 2021

880784796388